/* ═══════════════════════════════════════════════════════════
 TIMELABS DESIGN TOKENS - extracted from /hr-software-india
 ═══════════════════════════════════════════════════════════ */
:root {
 /* Brand palette */
 --tl-navy: #001659; /* hero bg, nav bg */
 --tl-navy-dark: #071428; /* deeper hero section */
 --tl-navy-mid: #001659; /* section separators, cards */
 --tl-teal: #1E40AF; /* primary CTA green */
 --tl-teal-dark: #030303; /* CTA hover */
 --tl-teal-light: #F7F9FD; /* teal tint backgrounds */
 --tl-orange: #ff6b35; /* accent / highlight numbers */
 --tl-yellow: #ffc107; /* stars, badges */
 --tl-white: #ffffff;
 --tl-off-white: #F6F8FF; /* section backgrounds */
 --tl-light-gray: #eef1f6; /* borders, subtle bg */
 --tl-mid-gray: #9ba8bc; /* muted text */
 --tl-body-text: #2d3a4a; /* body copy */
 --tl-heading: #343A40; /* dark headings on white */
 /* Typography - Nunito Sans (matches timelabs pages) */
 --font-body: 'Plus Jakarta Sans', sans-serif;
 --font-head: 'Plus Jakarta Sans', sans-serif;
 /* Spacing */
 --r: 8px;
 --r2: 14px;
 --r3: 22px;
 --r4: 32px;
 /* Shadows */
 --sh-sm: 0 2px 8px rgba(11,31,58,.08);
 --sh: 0 6px 24px rgba(11,31,58,.12);
 --sh-lg: 0 16px 48px rgba(11,31,58,.16);
}

/* ─── RESET + BASE ─────────────────────────────────────── */
*, *::before, *::after { box-sizing:border-box; margin:0; padding:0 }
.priceHead i::before {content: "\e930";}
.parent.active .priceHead i::before {content: "\e92e";}
html { scroll-behavior:smooth }
body {
 font-family: var(--font-body);
 color: var(--tl-body-text);
 background: var(--tl-white);
 line-height: 1.65;
 font-size: 15px;
 -webkit-font-smoothing: antialiased;
}
h1,h2,h3,h4 { font-family: var(--font-head); line-height: 1.2; color: var(--tl-heading) }
a { text-decoration: none; color: inherit }
img { max-width:100%; display:block }
ul { list-style:none }

/* ─── LAYOUT ────────────────────────────────────────────── */
.container { max-width: 1380px; margin: 0 auto; padding: 0 24px }
.section-pad { padding: 72px 0 }
.section-pad-sm { padding: 48px 0 }

/* ─── TYPOGRAPHY HELPERS ────────────────────────────────── */
.eyebrow {
 display: inline-flex; align-items: center; gap: 7px;
 font-size: 14px; font-weight: 700; letter-spacing: .09em;
 text-transform: uppercase; color: var(--tl-teal);
 margin-bottom: 14px;
}
.eyebrow::before {
 content:''; width:18px; height:2px;
 background: var(--tl-teal); border-radius:2px;
}
.section-title {
 font-size: clamp(1.65rem, 3.2vw, 3.7rem) !important;
 font-weight: 600; color: var(--tl-heading) !important;
 margin-bottom: 14px;
 margin-top:0px;
 line-height:normal;
 font-family: 'Plus Jakarta Sans', sans-serif;
}
.section-title span { color: var(--tl-teal) }
.section-sub {
 font-size: 18px; color: #5a6a80;
 max-width: 560px; line-height:1.7; font-family: 'Plus Jakarta Sans', sans-serif;
}
.center-text { text-align: center }
.center-text .section-sub { margin: 0 auto }

/* ─── BUTTONS ───────────────────────────────────────────── */
.btn {
 display: inline-flex; align-items: center; justify-content: center;
 gap: 8px; font-family: var(--font-body);
 font-weight: 600; font-size: 14px; border-radius: var(--r2);
 cursor: pointer; transition: all .18s; border: none;
 white-space: nowrap; line-height:1; padding: 13px 26px;
}
.btn-primary {
 background: var(--tl-teal);
 color: var(--tl-white);
 box-shadow: 0 4px 16px rgba(0, 197, 163, .3);
 padding: 21px 41px;
 border-radius: 50px;
}
.btn-primary:hover { background: var(--tl-teal-dark); transform: translateY(-1px); box-shadow: 0 6px 20px rgba(0,197,163,.4) }
.btn-primary-lg {padding: 23px 41px;font-size: 16px;border-radius: 50px; font-weight: 500;}
.btn-outline {
 background: transparent; color: var(--tl-teal);
 border: 2px solid var(--tl-teal);
}
.btn-outline:hover { background: var(--tl-teal-light) }
.btn-ghost-white {
 background: #343A40; color: var(--tl-white);
 border: 1.5px solid rgba(255,255,255,.25);
}
.btn-ghost-white:hover { background: rgba(255,255,255,.8) }
.btn-navy {
 background: var(--tl-navy); color: var(--tl-white);
 border: 1.5px solid rgba(255,255,255,.1);
}
.btn-navy:hover { background: var(--tl-navy-mid) }
.btn-gold {
 background: #e6960a; color: var(--tl-white);
 box-shadow: 0 4px 16px rgba(230,150,10,.3);
}
.btn-gold:hover { background: #d08a07; transform:translateY(-1px) }

header {
 background: #0c112f;
 position: sticky; top: 0; z-index: 200;
 border-bottom: 1px solid rgba(255,255,255,.07);
}
.header-inner {
 display: flex; align-items: center;
 justify-content: space-between;
 height: 68px; gap: 20px;
}
.logo-wrap {
 display: flex; align-items: center; gap: 0;
 flex-shrink: 0;
}
.logo-wrap img {
 height: 38px; width: auto;

 filter: brightness(0) invert(1); 
}

.logo-text {
 font-family: var(--font-head);
 font-size: 22px; font-weight: 700;
 color: var(--tl-white);
 letter-spacing: -0.5px;
}
.logo-text span { color: var(--tl-teal) }
.nav-right {
 display: flex; align-items: center; gap: 28px;
}
.nav-links {
 display: flex; align-items: center; gap: 24px;
}
.nav-links a {
 font-size: 13px; font-weight: 600;
 color: rgba(255,255,255,.65);
 transition: color .15s;
}
.nav-links a:hover, .nav-links a.active { color: var(--tl-white) }
.nav-support {
 display: flex; align-items: center; gap: 7px;
 font-size: 13px; font-weight: 700; color: var(--tl-white);
 text-decoration: none;
}
.nav-support-icon { width: 18px; height: 18px; opacity:.85 }
.nav-demo-btn { padding: 10px 22px; font-size: 13px }

/* ─── HERO ──────────────────────────────────────────────── */
.hero {
 background-image: url(../images/homeherobg.png);
 background-size: cover;
 background-position: center center;
 padding: 120px 0 56px;
 position: relative;
 overflow: hidden;
}

.hero-bg-circle {
 position: absolute; border-radius: 50%;
 background: rgba(0,197,163,.07);
 pointer-events: none;
}
.hero-bg-circle-1 { width:500px; height:500px; top:-180px; right:-100px }
.hero-bg-circle-2 { width:320px; height:320px; bottom:-120px; left:5%; background:rgba(0,197,163,.05) }
.hero-content { position:relative; z-index:1 }
.hero-layout {
 display: grid;
 grid-template-columns: 1fr 380px;
 gap: 56px; align-items: center;
}
.custoncshra {
 color: #343A40;
 font-size: 50px;
 font-weight: 700;
 font-family: 'Plus Jakarta Sans', sans-serif
}
 .custoncshra em {
 color: #1E40AF;
 }

 @keyframes pulse {
 0%, 100% {
 opacity: 1;
 transform: scale(1)
 }

 50% {
 opacity: .5;
 transform: scale(1.3)
 }
 }
.hero h1 {
 font-size: clamp(32px, 3.65vw, 50px);
 font-weight: 800; color: #343A40;
 line-height: 58px; margin-bottom: 18px; font-family: 'Plus Jakarta Sans', sans-serif;
}
.pricing-hero-title span,
.pricing-hero-title em {
 display: block;
}
.hero h1 em { color: var(--tl-teal); font-style: normal }
.hero-sub {
 font-size: 20px;
 color: #343A40;
 line-height: 36px;
 margin-bottom: 28px;
 max-width: 87%;
 font-weight: 500;
 font-family: 'Plus Jakarta Sans', sans-serif;
 margin-left: auto;
 margin-right:auto;
}
.hero-checks {
 display: flex; flex-direction: column; gap: 10px;
 margin-bottom: 32px;
}
.hero-check {
 display: flex; align-items: center; gap: 10px;font-family: 'Plus Jakarta Sans', sans-serif;
 font-size: 20px; line-height: 36px; font-weight: 500; color: #343A40;
}
.check-icon {
 width: 20px; height: 20px;
 background: none; display: flex;
 align-items: center; justify-content: center;
 flex-shrink: 0; font-size: 18px; color: var(--tl-teal); font-weight:700;
}
.hero-ctas {
 display: flex; gap: 12px; align-items: center; flex-wrap: wrap;
 margin-bottom: 36px;
}
.hero .hero-stats {
 display: flex; gap: 32px; flex-wrap: wrap;
 padding: 24px 28px; margin-top: 28px;
 background: #EEF0FC; border: none; border-radius: var(--r2);
}
.hero .hero-stat-val {
 font-family: var(--font-head);
 font-size: 2.4rem; font-weight: 700; color: var(--tl-heading);
 display: block; line-height: 1;
}
.hero .hero-stat-label {
 font-size: 12px; color: var(--tl-mid-gray);
 margin-top: 4px; display: block;
}

/* ─── PRICING CARD (the form box on hero) ───────────────── */
.hero-price-card {
 background: var(--tl-white);
 border-radius: var(--r4);
 padding: 32px 28px;
 box-shadow: var(--sh-lg);
 position: relative;
}
.hero-price-card::before {
 content: 'Plans from ₹65/employee';
 position: absolute; top: -13px; left: 50%;
 transform: translateX(-50%);
 background: var(--tl-teal);
 color: #fff; font-size: 11px; font-weight: 700;
 letter-spacing: .07em; text-transform: uppercase;
 padding: 4px 16px; border-radius: 99px; white-space:nowrap;
}
.hero-price-card h3 {
 font-size: 18px; font-weight: 600; color: var(--tl-heading);
 margin-bottom: 5px; text-align: center; margin-top:4px;
 font-family: 'Plus Jakarta Sans', sans-serif;
}
.hero-price-card .sub { font-size:12px; color:#6b7a90; text-align:center; margin-bottom:13px; font-family: 'Plus Jakarta Sans', sans-serif; }
.billing-toggle {
 display: flex; background: var(--tl-light-gray);
 border-radius: 99px; padding: 4px;
 margin-bottom: 7px;
}
.billing-opt {
 flex: 1; text-align: center; padding: 8px 12px;
 font-size: 12px; font-weight: 700; border-radius: 99px;
 cursor: pointer; transition: all .2s;
 color: var(--tl-mid-gray); user-select:none;
 white-space:nowrap;
}
.billing-opt.active {
 background: var(--tl-white); color: var(--tl-heading);
 box-shadow: 0 2px 8px rgba(0,0,0,.1);
}
.save-pill {
 font-size: 12px; background: var(--tl-teal); color:#fff;
 padding:2px 6px; border-radius:99px; font-weight:700;
 letter-spacing:.04em; vertical-align:middle; margin-left:4px;
}
.mini-plans { display:flex; flex-direction:column; gap:8px; margin-bottom:20px }
.mini-plan {
 border: 1.5px solid var(--tl-light-gray);
 border-radius: var(--r2); padding: 12px 14px;
 cursor: pointer; transition: all .18s;
 display: flex; align-items: center; justify-content: space-between; gap:10px;
}
.mini-plan:hover { border-color: var(--tl-teal); background: var(--tl-teal-light) }
.mini-plan.selected { border-color: var(--tl-teal); }
.mini-plan-left { display:flex; flex-direction:column; gap:2px }
.mini-plan-name { font-size:13px; font-weight:600; color:var(--tl-heading) }
.mini-plan-desc { font-size:11px; color:#6b7a90 }
.mini-plan-price { text-align:right }
.mini-plan-amt { font-size:15px; font-weight:700; color:var(--tl-teal); font-family:var(--font-head) }
.mini-plan-per { font-size:10px; color:#9ba8bc; display:block; margin-top:1px }
.mini-plan.featured-plan { border-color:var(--tl-teal) !important; }
.popular-tag {
 font-size:9px; font-weight:700; text-transform:uppercase;
 letter-spacing:.07em; background:var(--tl-teal); color:#fff;
 padding:2px 7px; border-radius:99px;
}
.hero-price-ctas { display:flex; flex-direction:column; gap:8px }
.hero-price-ctas .btn { width:100%; justify-content:center }
.trust-micro {
 display:flex; align-items:center; justify-content:center;
 gap:12px; margin-top:14px; font-size:11px; color:#9ba8bc; flex-wrap:wrap;
}
.trust-micro span { display:flex; align-items:center; gap:4px }

/* ─── LOGO BAR ──────────────────────────────────────────── */
.logo-bar { background: var(--tl-off-white); border-bottom:1px solid var(--tl-light-gray) }
.logo-bar-inner {
 display:flex; align-items:center; justify-content:center;
 gap:0; flex-wrap:wrap;
}
.brand-section{position:relative;}
.logo-pill {
 font-size:13px; font-weight:700; color:#6b7a90;
 padding:0 20px; border-right:1px solid var(--tl-light-gray);
 white-space:nowrap;
}
.logo-pill:last-child { border-right:none }

/* ─── COMPETITOR BANNER ─────────────────────────────────── */
/* wraps the intro heading + a nested .setu-stats-section (same stats strip design as Index) */
.comp-bar { background: var(--tl-off-white); padding-top:26px }
.comp-bar-intro {
 font-size:20px; font-weight:700; color:var(--tl-heading);
 text-align:center;
}
.comp-bar-intro span { color: var(--tl-teal) }
/* tighten Index's default section spacing so it sits close under the heading here */
.comp-bar-stats.setu-stats-section { margin-bottom:0; margin-top:20px }

/* ─── PLAN CARDS ────────────────────────────────────────── */
.plans-section { background: var(--tl-off-white) }
.plans-grid {
 display:grid !important;
 grid-template-columns: repeat(auto-fit, minmax(248px, 1fr));
 gap:18px; margin-top:40px;
}
.plan-card {
 background: var(--tl-white);
 border:2px solid var(--tl-light-gray);
 border-radius:var(--r3); padding:28px 22px;
 position:relative; transition:all .22s;
}
.plan-card:hover { transform:translateY(-4px); box-shadow:var(--sh-lg) }
.plan-card.popular {
 border-color:var(--tl-teal);
 box-shadow: 0 0 0 4px rgba(0,197,163,.1), var(--sh);
}
.plan-card.popular::before {
 content:'Most Popular';
 position:absolute; top:-14px; left:50%;
 transform:translateX(-50%);
 background:var(--tl-teal); color:#fff;
 font-size:10px; font-weight:600; letter-spacing:.09em;
 text-transform:uppercase; padding:4px 16px; border-radius:99px;
 white-space:nowrap;
}
.plan-card.hardware-card {
 border-color:#e6960a;
 background:linear-gradient(160deg,#fffdf5 0%,#fff 100%);
}
.plan-card.hardware-card::before {
 content:'Only in India';
 position:absolute; top:-14px; left:50%;
 transform:translateX(-50%);
 background:#e6960a; color:#fff;
 font-size:10px; font-weight:600; letter-spacing:.09em;
 text-transform:uppercase; padding:4px 16px; border-radius:99px;
 white-space:nowrap;
}
.plan-tier {
 font-size:12px; font-weight:700; letter-spacing:.08em;
 text-transform:uppercase; margin-bottom:8px;
 display:flex; align-items:center; gap:6px;
}
.plan-tier::before {
 content:''; display:inline-block; width:6px; height:6px; border-radius:50%;
 background:currentColor; flex-shrink:0;
}
.plan-name {
 font-family:var(--font-head); font-size:1.45rem;
 font-weight:600; margin-bottom:6px;
}
.plan-tagline {
 font-size:12px; color:#6b7a90; margin-bottom:20px;
 line-height:1.55; min-height:38px;
}
.plan-price-block {
 margin-bottom:20px; padding-bottom:18px;
 border-bottom:1px solid var(--tl-light-gray);
}
.plan-price-row { display:flex; align-items:baseline; gap:3px }
.plan-amt {
 font-family:var(--font-head); font-size:2rem; font-weight:600;
 color:var(--tl-heading); transition:all .25s;
}
.plan-per-mo { font-size:13px; color:#9ba8bc }
.plan-per-emp {
 font-size:14px; color:#6b7a90; margin-top:5px;
}
.plan-per-emp strong { color:var(--tl-teal); font-weight:600 }
.plan-annual-save {
 font-size:14px; font-weight:700; color:var(--tl-teal);
 margin-top:4px; display:none;
}
.plan-extra { font-size:13px; color:#9ba8bc; margin-top:3px }
.plan-cta {
 display: block;
 text-align: center;
 padding: 21px 41px;
 border-radius: var(--r2);
 font-weight: 600;
 font-size: 17px;
 cursor: pointer;
 transition: all .18s;
 margin-bottom: 8px;
 border: none;
 font-family: var(--font-body);
 border-radius: 50px;
}
.cta-teal { background:var(--tl-teal); color:#fff; box-shadow:0 3px 12px rgba(0,197,163,.25); font-size: 17px; }
.cta-teal:hover { background:var(--tl-teal-dark); transform:translateY(-1px);color:#fff; }
.cta-outline-teal { background:transparent; color:var(--tl-teal); border:2px solid var(--tl-teal); font-size: 17px; }
.cta-outline-teal:hover { background:var(--tl-teal-light) }
.cta-navy { background:var(--tl-navy); color:#fff }
.cta-navy:hover { background:var(--tl-navy-mid);color:#fff; }
.cta-gold { background:#e6960a; color:#fff; box-shadow:0 3px 12px rgba(230,150,10,.25) }
.cta-gold:hover { background:#d08a07; transform:translateY(-1px); color:#fff;}
.plan-cta-note {
 font-size:11px; color:#9ba8bc; text-align:center;
 margin-bottom:18px;
}
.plan-features { display:flex; flex-direction:column; gap:0 }
.plan-feature {
 font-size:12px; color:var(--tl-body-text);
 padding:7px 0; border-bottom:1px solid var(--tl-light-gray);
 display:flex; align-items:flex-start; gap:8px; line-height:1.45;
}
.plan-feature:last-child { border-bottom:none }
.plan-feature.dim { color:#9ba8bc }
.feat-ic {
 width:16px; height:16px; border-radius:50%;
 display:flex; align-items:center; justify-content:center;
 font-size:9px; font-weight:600; flex-shrink:0; margin-top:1px;
}
.fi-yes { background:#d6f5ef; color:#00896a }
.fi-no { background:var(--tl-light-gray); color:#bcc5d0 }
.fi-cap { background:#fff3cd; color:#8a6000 }
.feat-badge {
 font-size:10px; font-weight:700; padding:1px 5px;
 border-radius:3px; background:#fff3cd; color:#8a6000;
 margin-left:auto; flex-shrink:0;
}

/* ─── MICRO PLAN STRIP ──────────────────────────────────── */
.micro-strip {
 background-image: url('../images/ctabg.jpg');
 background-size: cover;
 background-position: center;
 border-radius: 0;
 padding: 64px 28px;
 /* no bottom margin: the white .perpetual-section below supplies the gap */
 margin: 44px 0 0;
 display: flex;
 flex-direction: column;
 align-items: center;
 justify-content: center;
 text-align: center;
 position: relative;
 overflow: hidden;
}
.micro-strip-fan {
 position: absolute;
 top: -38px; left: -38px;
 width: 200px; height: auto;
 opacity: .45;
 transform: rotate(157deg);
 pointer-events: none;
 z-index: 0;
}
.micro-strip-text { position: relative; z-index: 1 }
.micro-strip .section-title {
 font-size: clamp(1.5rem, 2.6vw, 2.2rem) !important;
 margin-bottom: 12px;
}
.micro-strip-text h4 {
 font-size:22px; font-weight:600; color:var(--tl-white); margin-bottom:4px;
}
.micro-strip-text p {
 font-size:16px; color:rgba(255,255,255); line-height:1.5;
}
.micro-strip-price {
 font-family:var(--font-head); font-size:1.5rem;
 font-weight:700; color:#60A5FA;
 margin-top:18px;
}
.micro-strip-cta { margin-top:16px }
.micro-strip-price sup { font-size:.8rem; vertical-align:super }
.micro-strip-price sub { font-size:1.2rem; color:rgba(255,255,255); font-weight:600 }

/* ─── PERPETUAL PLAN CARD ───────────────────────────────── */
/* full-width white band behind the card, per Figma */
.perpetual-section { background:#fff; padding:44px 0 }
.perpetual-card {
 text-align:left; margin-top:0; padding:56px 60px;
 /* scrim keeps the copy readable over the photo; photo sits right, gradient is the fallback */
 background:
   linear-gradient(to right,
     rgba(0,22,89,.97) 0%,
     rgba(0,22,89,.94) 34%,
     rgba(0,22,89,.62) 56%,
     rgba(0,22,89,.28) 100%),
   url('../images/perpetual-cost-quality.jpg') right center / cover no-repeat,
   linear-gradient(135deg, var(--tl-navy) 0%, var(--tl-navy-dark) 100%);
 border-radius: var(--r3);
 position:relative; overflow:hidden;
}
.perpetual-card::before {
 content:''; position:absolute; inset:0;
 background: radial-gradient(circle at 85% 20%, rgba(30,64,175,.35), transparent 55%);
 pointer-events:none;
}
.perpetual-fan {
 position:absolute; left:-60px; top:50%;
 width:380px; height:auto;
 transform:translateY(-50%) rotate(18deg);
 opacity:.5; pointer-events:none; z-index:0;
}
@media(max-width:767px){
 .perpetual-fan { width:260px; left:-70px }
}
.perpetual-body { position:relative; z-index:1; max-width:760px }
.perpetual-badge {
 display:inline-flex; align-items:center; gap:8px;
 background:#FFF6E8; color:#E6960A;
 padding:6px 16px; border-radius:99px;
 font-size:12px; font-weight:700; letter-spacing:.09em;
 text-transform:uppercase; margin-bottom:22px;
}
.perpetual-badge::before {
 content:''; width:6px; height:6px; border-radius:50%;
 background:currentColor; flex-shrink:0;
}
.perpetual-title {
 font-family:'Plus Jakarta Sans', sans-serif;
 font-size: clamp(1.75rem, 3.2vw, 2.9rem);
 font-weight:700; color:#fff; line-height:1.15;
 margin:0 0 20px;
}
.perpetual-sub {
 font-size:22px; font-weight:500; color:#fff;
 margin-bottom:16px; position:relative;
}
.perpetual-card .section-sub-own {
 color: rgba(255,255,255,.78); position:relative;
 margin-left:0; margin-right:0; margin-bottom:0; max-width:680px; line-height:1.7;
}

@media(max-width:767px){
 .perpetual-card {
  padding:40px 24px;
  /* photo would sit under the copy at this width, so darken the scrim across the whole card */
  background:
    linear-gradient(to right, rgba(0,22,89,.95) 0%, rgba(0,22,89,.88) 100%),
    url('../images/perpetual-cost-quality.jpg') right center / cover no-repeat,
    linear-gradient(135deg, var(--tl-navy) 0%, var(--tl-navy-dark) 100%);
 }
 .perpetual-title { font-size:1.75rem }
 .perpetual-sub { font-size:18px }
}

/* ─── FEATURE TABLE ─────────────────────────────────────── */
.table-section { background:var(--tl-white) }
.feat-table-wrap { overflow-x:auto; border-radius:var(--r2); border:1px solid var(--tl-light-gray); margin-top:40px; box-shadow:var(--sh-sm) }
.feat-table { width:100%; border-collapse:collapse; min-width:680px }
.feat-table thead th {
 padding:14px 16px; font-size:11px; font-weight:600;
 letter-spacing:.08em; text-transform:uppercase;
 color:#6b7a90; background:var(--tl-off-white);
 border-bottom:2px solid var(--tl-light-gray); text-align:left;
}
.feat-table thead th.plan-col { text-align:center; min-width:130px }
.feat-table thead th.pop-col {
 background:var(--tl-teal-light);
 color:#00896a; border-bottom:2px solid var(--tl-teal);
}
.feat-table tbody tr.cat-row td {
 background:var(--tl-off-white);
 font-size:11px; font-weight:600; letter-spacing:.07em;
 text-transform:uppercase; color:var(--tl-navy);
 padding:10px 16px;
 border-top:2px solid var(--tl-light-gray);
}
.feat-table tbody td {
 padding:10px 16px; border-bottom:1px solid var(--tl-light-gray);
 font-size:12px; color:var(--tl-body-text); vertical-align:middle;
}
.feat-table tbody td.plan-col { text-align:center }
.feat-table tbody td.pop-col { background:rgba(0,197,163,.04); text-align:center }
.feat-table tbody tr:hover td { background:var(--tl-off-white) }
.feat-table tbody tr:hover td.pop-col { background:rgba(0,197,163,.07) }
.feat-table tfoot td {
 padding:14px 16px; background:var(--tl-off-white);
 border-top:2px solid var(--tl-light-gray);
}
.feat-table tfoot td.pop-col { background:var(--tl-teal-light) }
.tck { color:#00c5a3; font-size:16px; font-weight:900 }
.tx { color:#cdd5df; font-size:16px }
.tcap { display:inline-block; font-size:10px; font-weight:700; padding:2px 6px; border-radius:3px; background:#fff3cd; color:#8a6000 }

/* ─── ROI CALCULATOR ────────────────────────────────────── */
.calc-section { background:var(--tl-off-white) }
.calc-grid {
 display:grid; grid-template-columns:1fr 1fr;
 gap:48px; align-items:flex-start; margin-top:0px;
}
.talkexpert:hover {color: #fff;}


/* ------ HR SAMVAAD CSS ------------*/
.joinevent {
 padding-top: 0px;
}

.Event-section {
 padding: 30px 0
}
.About-section {
 background: #F2F8FF;
}

.hr-samvaad-aboutus {
 background: #F2F8FF
}
.hrsamvaad {
 
 background-image: url(../images/herobg.jpg) ;
 background-position: center center;
 padding: 150px 0 150px;
 position: relative;
 overflow: hidden;
}
.community-section {text-align: center;}
.about-us-title {
 font-size: clamp(18px, 4vw, 32px);
 line-height: 1.2;
 text-align: center;
}

.speaker-image-col {
 text-align: right;
}

.speaker-image {
 display: inline-block;
 max-height: 360px; 

 position: relative;
 bottom: -19px;
}



@media (max-width: 767px) {

 .speaker-image-col {
 display: none;
 }

 .speaker-image {
 display: none;
 }
}

@media (max-width: 767px) {

 .hrliveinnerdata {
 display: flex;
 flex-direction: column;
 }

 .hrliveinnerdata .col-sm-5 {
 text-align: center !important;
 margin-top: 15px;
 order: 2;
 }

 .hrliveinnerdata .col-sm-5 img {
 margin-top: 0 !important;
 max-height: 160px; 
 width: auto;
 display: inline-block;
 }

 .hrliveinnerdata .col-sm-7 {
 order: 1;
 text-align: center;
 }

 
 .hr-samvaad-about-heading {
 font-size: 18px;
 line-height: 30px;
 }
 
}


@media (max-width: 768px) {
 .about-us-text {
 text-align: center;
 line-height: 1.5;
 font-size: 8px;
 word-break: break-word;
 }

 .about-us-text br {
 display: none;
 }
}

.community-heading-join {
 font-size: 48px;
 line-height: 1.2;
 font-weight: 700;
 text-align: center;
 margin-bottom: 20px;
}

.community-text {
 font-size: 18px;
 line-height: 1.6;
 text-align: center;
 max-width: 800px;
 margin: 0 auto 25px;
 padding: 0 10px;
}

.join-btn {
 display: inline-block;
 padding: 12px 24px;
 font-size: 16px;
 text-align: center;
 border-radius: 15px;
}

/* Tablet */
@media (max-width: 992px) {
 .community-heading-join {
 font-size: 38px;
 }

 .community-text {
 font-size: 16px;
 }
}


/* Mobile */
@media (max-width: 576px) {
 .community-heading-join {
 font-size: 26px;
 line-height: 1.3;
 padding: 0 15px;
 }

 .community-text {
 font-size: 14px;
 line-height: 1.5;
 padding: 0 15px;
 }

 .join-btn {
 font-size: 14px;
 padding: 10px 18px;
 width: 100%;
 display: block;
 margin: 0 auto;
 }


 .community-heading-join br {
 display: none; 
 }
}

.register-community-btn {
 background-color: #FD9D2D;
 color: #fff !important;
 margin-top: 20px;
 display: inline-flex;
 align-items: center;
 justify-content: center;
 gap: 8px;
 font-family: var(--font-body);
 font-weight: 600;
 font-size: 14px;
 border-radius: var(--r2);
 cursor: pointer;
 transition: all .18s;
 border: none;
 white-space: nowrap;
 line-height: 1;
 padding: 13px 26px;
 text-decoration: none;
}

 .register-community-btn:hover {
 color: #fff;
 opacity: 0.9;
 }

.live-btn {
 background: #FD9D2D;
 color: #fff;
 border-radius: 20px;
 padding: 6px 18px;
 font-size: 12px;
 margin-bottom: 20px;
 display: inline-flex;
 align-items: center;
 gap: 6px;
 text-decoration: none;
}
.register-btn-wrapper {
 margin-top: 30px;
 

}

.register-btn {
 display: inline-block;
 background: #f08d16;
 color: #fff !important;
 border-radius: 30px;
 padding: 12px 28px;
 font-size: 16px;
 font-weight: 600;
 text-align: left;
 text-decoration: none !important;
 transition: 0.3s ease;
}



/* Responsive */
@media (max-width: 767px) {
 .register-btn {
 padding: 10px 22px;
 font-size: 14px;
 border-radius: 25px;
 }

 .register-btn-wrapper {
 margin-top: 20px;
 }
}
.live-icon {
 width: 14px;
 height: 14px;
}

..btn-register {
 background: #0F4F93;
}
.register-btn {
 background: #0F4F93;
 color: #fff;
 border-radius: 20px;
 padding: 6px 18px;
 font-size: 12px;
 margin-top: 10px;
 display: inline-flex;
 align-items: center;
 gap: 6px;
 text-decoration: none;
}
/* Only Mobile Responsive */
@media (max-width: 768px) {
 .hr-samvaad-about-heading {
 text-align: left;
 line-height: 1.3;
 }

 .hr-samvaad-about-heading br {
 display: none;
 }
}

/* Logo */
.community-logo {
 width: 154px;
 height: 60px;
 opacity: 1;
 display: block;
 margin: 0 auto 30px;
}

/* Heading */
.community-heading {
 font-family: 'Poppins', sans-serif;
 font-weight: 500;
 font-size: 60px;
 line-height: 60px;
 letter-spacing: 0;
 text-align: center;
 vertical-align: middle;
 color: #fff;
 margin-bottom: 20px;
}
.community-heading-join {
 font-family: 'Poppins', sans-serif;
 font-weight: 500;
 font-size: 35px;
 letter-spacing: 0;
 text-align: center;
 vertical-align: middle;
 color: #fff;
 margin-bottom: 20px;
}
/* Mobile Responsive */
@media (max-width: 767px) {
 .about-us-title {
 font-size: 11px; 
 line-height: 16px;
 text-align: center;
 letter-spacing: 1px;
 }
 
}
/* Paragraph */
.community-text {
 font-family: 'Poppins', sans-serif;
 font-weight: 400;
 font-size: 16px;
 line-height: 26px;
 letter-spacing: 0;
 text-align: center;
 vertical-align: middle;
 color: #A0A3A8;
 max-width: 700px;
 margin: 0 auto 30px;
}

/* Mobile Responsive */
@media (max-width: 767px) {

 .community-heading-join {
 font-size: 24px;
 line-height: 34px;
 text-align: center;
 padding: 0 15px;
 }

 .community-text {
 font-size: 14px;
 line-height: 24px;
 text-align: center;
 padding: 0 15px;
 }
}

/* Button */
.join-btn {
 background-color: #FD9D2D;
 color: #fff;
 display: inline-flex;
 align-items: center;
 gap: 6px;
 padding: 12px 24px;
 text-decoration: none;
 border-radius: 6px;
 font-family: 'Poppins', sans-serif;
}
.hrlive {
 background-image: url(../images/hr-event-blue-bg.svg);
 background-size: cover;
 position: relative;
 overflow: hidden;
 border-radius: 25px;
 padding: 40px 40px 0;
}
.hrlive-events {
 background-image: url(../images/hr-event-blue-bg.svg);
 background-size: cover;
 background-position: center;
 position: relative;
 overflow: hidden;
 border-radius: 25px;
 padding: 80px;
 width: 100%;
}

.register-btn {
 display: inline-flex;
 align-items: center;
 justify-content: center;
 width: 141px;
 height: 44px;
 background: #0F4F93;
 color: #fff !important;
 border-radius: 58px;
 padding: 12px 32px;
 opacity: 1;
 text-decoration: none;
 font-size: 14px;
 font-weight: 500;
 border: none;
 transition: 0.3s ease;
}

 .register-btn:hover {
 background: #0c437d;
 color: #fff !important;
 }


.coming-soon-btn {
 display: inline-flex;
 align-items: center;
 justify-content: center;
 width: 141px;
 height: 44px;
 
 color: #fff !important;
 border-radius: 58px;
 padding: 14px 32px;
 margin-top: 15px; 
 font-size: 14px;
 font-weight: 500;
 text-decoration: none;
 border: none;
 opacity: 1;
 transition: 0.3s ease;
}

 

/* Tablet */
@media (max-width: 992px) {
 .hrlive-events {
 padding: 20px 25px;
 border-radius: 20px;
 }
}

/* Mobile */
@media (max-width: 768px) {
 .hrlive-events {
 padding: 20px 15px;
 border-radius: 15px;
 background-position: center;
 }
}

/* Small Mobile */
@media (max-width: 480px) {
 .hrlive-events {
 padding: 15px 12px;
 }
}

.hrlive-join {
 background-image: url(../images/hr-event-blue-bg.svg);
 background-size: cover;
 background-position: center;
 position: relative;
 overflow: hidden;
 border-radius: 25px;
 padding: 80px;
}

/* Large desktops */
@media (min-width: 1200px) {
 .hrlive-join {
 padding: 90px;
 border-radius: 28px;
 }
}

/* Laptops / small desktops */
@media (max-width: 1199px) and (min-width: 768px) {
 .hrlive-join {
 padding: 60px;
 border-radius: 22px;
 }
}

/* Tablets & mobile */
@media (max-width: 767px) {
 .hrlive-join {
 padding: 40px;
 border-radius: 18px;
 background-position: center;
 }
}
@media (max-width: 480px) {
 .hrlive-join {
 padding: 25px;
 border-radius: 14px;
 }
}
.hrliveinnerdata div {

 align-items: center;
 justify-content: flex-start;
 flex-direction: column;
}
.hrliveinnerdata{
 display: flex;
 align-items: flex-start;
 justify-content: space-between;
}
.hr-badge {
 display: inline-flex;
 align-items: center;
 background: url(../images/hr-logo.svg);
 padding: 120px 309px;
 margin-bottom: 0px;
}

.countdown-box {
 display: inline-block;
 border-radius: 12px;
 overflow: hidden;
 padding: 0;
 border: 1px solid rgba(255, 255, 255, 0.19);
 background: rgba(255, 255, 255, 0.07);
 backdrop-filter: blur(24.9px);
 -webkit-backdrop-filter: blur(24.9px);
}

.countdown-item {
 float: left;
 width: 70px;
 text-align: center;
 padding: 10px 5px 8px;
 position: relative;
}
.speaker-image img {
 display: inline-block;
 max-height: 300px;
 margin-top: 130px;
}
 .countdown-item:after {
 content: "";
 position: absolute;
 right: 0;
 top: 10px;
 height: 38px;
 width: 1px;
 background: rgba(255,255,255,0.15);
 }

 .countdown-item.last-item:after {
 display: none;
 }

 .countdown-item span {
 display: block;
 font-size: 28px;
 font-weight: 600;
 color: #ffffff;
 line-height: 28px;
 font-family: 'Poppins', sans-serif;
 }

 .countdown-item small {
 display: block;
 margin-top: 6px;
 font-size: 10px;
 letter-spacing: 1px;
 color: rgba(255,255,255,0.75);
 font-family: 'Poppins', sans-serif;
 }

.about-us-title {
 font-family: 'Poppins', sans-serif;
 font-weight: 400;
 font-style: normal;
 font-size: 20px;
 line-height: 24px;
 letter-spacing: 0;
 text-align: left;
 vertical-align: middle;
 text-transform: uppercase;
 color: #333333;
 
}
.about-us-heading {
 font-family: 'Poppins', sans-serif;
 font-weight: 500;
 font-style: normal;
 font-size: 36px;
 line-height: 100%;
 letter-spacing: 0;
 vertical-align: middle;
 color: #333333;
 
}
.hr-samvaad-about-heading {
 margin-top: 10px;
 color: #333333;
 text-align: left
 
}
.about-us-text {
 font-family: 'Poppins', sans-serif;
 font-weight: 400;
 font-style: normal;
 font-size: 16px;
 line-height: 27.2px;
 letter-spacing: 0;
 vertical-align: middle;
 color: #333333;
 margin-top: 10px;
 text-align: left
}
.hero-title {
 font-family: 'Poppins', sans-serif;
 font-weight: 600;
 font-size: 50px;
 line-height: 100%;
 letter-spacing: 0%;
 margin-top: 10px;
 color: #fff;
}
.hero-title-labour {
 font-family: 'Poppins', sans-serif;
 font-weight: 600;
 font-size: 42px;
 line-height: 100%;
 letter-spacing: 0%;
 
 color: #fff;
 text-align: center
 
}

/* Laptop */
@media (max-width: 1200px) {
 .hero-title-labour {
 font-size: 42px;
 }
}

/* Tablet */
@media (max-width: 992px) {
 .hero-title-labour {
 font-size: 36px;
 line-height: 1.2;
 }
}

/* Mobile */
@media (max-width: 768px) {
 .hero-title-labour {
 font-size: 28px;
 line-height: 1.3;
 margin-top: 5px;
 text-align: center;
 }
}

/* Small Mobile */
@media (max-width: 480px) {
 .hero-title-labour {
 font-size: 24px;
 }
}
.hero-head {
 color: #fff;
 font-size: 20px;
 margin-top: 15px;
}
.hero-head-text {
 color: #fff;
 font-size: 20px;

}
.line-img {
 display: block;
 margin-bottom: 50px;
 max-width: 250px; 
}

.countdown {
 display: flex;
 align-items: center;
 gap: 20px;
 flex-wrap: wrap;
 justify-content: center;
}

.time-box {
 width: 120px;
 height: 120px;
 border-radius: 20px;
 background: #111827;
 color: #fff;
 display: flex;
 flex-direction: column;
 align-items: center;
 justify-content: center;
 box-shadow: 0 10px 25px rgba(0,0,0,0.1);
}
.hero-head-text {
 color: #fff;
 font-size: 18px;
 margin-bottom: 24px;
 text-align: center
}

/* Laptop */
@media (max-width: 1200px) {
 .hero-head-text {
 font-size: 20px;
 }
}

/* Tablet */
@media (max-width: 992px) {
 .hero-head-text {
 font-size: 18px;
 margin-bottom: 20px;
 }
}

/* Mobile */
@media (max-width: 768px) {
 .hero-head-text {
 font-size: 16px;
 margin-bottom: 15px;
 text-align: center;
 }
}

/* Small Mobile */
@media (max-width: 480px) {
 .hero-head-text {
 font-size: 15px;
 }
}
 .time-box h2 {
 font-size: 42px;
 line-height: 1;
 margin-bottom: 10px;
 font-weight: 700;
 }

 .time-box span {
 font-size: 15px;
 opacity: .8;
 letter-spacing: .5px;
 }

.upcoming-events-section {
 padding: 60px 0;
 background: #f5f5f5;
}

.upcoming-events-heading {
 font-family: 'Poppins', sans-serif;
 font-size: 36px;
 font-weight: 500;
 color: #333333;
 margin-top: 47px;
}

/* Large desktops */
@media (min-width: 1200px) {
 .upcoming-events-heading {
 font-size: 40px;
 margin-top: 55px;
 }
}

/* Laptops / small desktops */
@media (max-width: 1199px) and (min-width: 768px) {
 .upcoming-events-heading {
 font-size: 32px;
 margin-top: 40px;
 }
}

/* Tablets & mobile */
@media (max-width: 767px) {
 .upcoming-events-heading {
 font-size: 24px;
 margin-top: 30px;
 text-align: center;
 }
}

/* Small mobile devices */
@media (max-width: 480px) {
 .upcoming-events-heading {
 font-size: 20px;
 margin-top: 20px;
 }
}

.event-card {
 background: #fff;
 border: 2px solid #e2e2e2;
 border-radius: 28px;
 min-height: 120px;
 margin-top: 20px;
 padding: 20px; 
}

.event-card-title {
 font-family: 'Poppins', sans-serif;
 font-size: 27px;
 font-weight: 500;
 color: #333333;
 margin-top: 0;
 margin-bottom: 15px;
 line-height: 36px;
}

.event-card-text {
 font-family: 'Poppins', sans-serif;
 font-size: 16px;
 font-weight: 400;
 color: #666666;
 line-height: 28px;
 margin-bottom: 18px;
}

.event-info {
 font-family: 'Poppins', sans-serif;
 font-size: 14px;
 color: #555555;
 margin-bottom: 10px;
 display: flex;
 align-items: center;
 gap: 8px;
}

.event-icon {
 width: 15px;
 height: 15px;
}

/* Large desktops */
@media (min-width: 1200px) {
 .event-card {
 padding: 24px;
 }

 .event-card-title {
 font-size: 28px;
 }
}

/* Laptops / small desktops */
@media (max-width: 1199px) and (min-width: 768px) {
 .event-card {
 padding: 18px;
 border-radius: 24px;
 }

 .event-card-title {
 font-size: 24px;
 line-height: 32px;
 }

 .event-card-text {
 font-size: 15px;
 line-height: 26px;
 }
}

/* Tablets & mobile */
@media (max-width: 767px) {
 .event-card {
 padding: 16px;
 border-radius: 20px;
 }

 .event-card-title {
 font-size: 20px;
 line-height: 28px;
 margin-bottom: 10px;
 }

 .event-card-text {
 font-size: 14px;
 line-height: 24px;
 margin-bottom: 12px;
 }

 .event-info {
 font-size: 13px;
 gap: 6px;
 }

 .event-icon {
 width: 14px;
 height: 14px;
 }
}

/* Small mobile */
@media (max-width: 480px) {
 .event-card {
 padding: 14px;
 border-radius: 16px;
 }

 .event-card-title {
 font-size: 18px;
 line-height: 26px;
 }

 .event-card-text {
 font-size: 13px;
 line-height: 22px;
 }

 .event-info {
 font-size: 12px;
 flex-wrap: wrap; 
 }

 .event-icon {
 width: 13px;
 height: 13px;
 }
}

.hr-samvaad-aboutus {

 padding: 60px 0;
}

.event-highlight-heading {
 font-family: Poppins;
 font-size: 34px;
 font-weight: 600;
 color: #333;
 margin-bottom: 35px;
}

.event-highlight-row {
 margin-left: -10px;
 margin-right: -10px;
}

 .event-highlight-row .col-sm-3 {
 padding-left: 10px;
 padding-right: 10px;
 }


.event-card {
 background: #fff;
 border: 2px solid #d9d9d9;
 border-radius: 28px;
 padding: 28px 30px;
 margin-top: 20px;
 min-height: 340px;
 width: 100%;
 box-sizing: border-box;
}
.event-card-hightlight {
 background: #fff;
 border: 2px solid #d9d9d9;
 border-radius: 28px;
 
 margin-top: 20px;
 
 width: 100%; 

 box-sizing: border-box;
}

.event-img {
 width: 100%;
 border-radius: 14px;
 display: block;
}

.play-btn {
 position: absolute;
 top: 50%;
 left: 50%;
 width: 55px;
 height: 55px;
 background: rgba(255,255,255,0.25);
 backdrop-filter: blur(4px);
 border-radius: 50%;
 transform: translate(-50%, -50%);
 text-align: center;
 line-height: 55px;
}

 .play-btn span {
 color: #fff;
 font-size: 20px;
 margin-left: 3px;
 }

.event-content {
 position: absolute;
 left: 15px;
 bottom: 15px;
}

 .event-content h4 {
 color: #fff;
 font-size: 16px;
 font-weight: 500;
 margin: 0 0 5px;
 }

 .event-content p {
 color: #fff;
 font-size: 12px;
 margin: 0;
 }
img.hrlogo {
 margin: 0px auto;
 max-width: 200px;
}
/* ------ HR SAMVAAD CSS END ------------*/
@media(max-width:780px) {
 .calc-grid { grid-template-columns:1fr } }
.calc-copy .section-title { font-size:clamp(1.65rem,2.8vw,2.7rem) !important }
.stat-row { display:grid; grid-template-columns:1fr 1fr; gap:12px; margin-top:24px }
.stat-box {
 background:var(--tl-white); border-radius:var(--r2);
 padding:16px; border-left:4px solid var(--tl-teal);
 box-shadow:var(--sh-sm);
}
.stat-box.orange { border-left-color:var(--tl-orange) }
.stat-num {
 font-family:var(--font-head); font-size:2.5rem;
 font-weight:600; color:var(--tl-teal); line-height:1;
}
.stat-box.orange .stat-num { color:var(--tl-orange) }
.stat-desc { font-size:14px; color:#6b7a90; margin-top:4px }

.calc-widget {
 background:var(--tl-navy); border-radius:var(--r4);
 padding:32px 28px; box-shadow:var(--sh-lg);
}
.calc-widget h3 {
 font-size:17px; font-weight:600; color:var(--tl-white);
 margin-bottom:24px;
}
.calc-row { margin-bottom:20px }
.calc-lbl {
 display:flex; justify-content:space-between; align-items:center;
 font-size:12px; font-weight:700;
 color:rgba(255,255,255,.55); margin-bottom:9px;
}
.calc-lbl span { font-size:14px; font-weight:600; color:var(--tl-white) }
input[type=range] {
 width:100%; -webkit-appearance:none; appearance:none;
 height:4px; border-radius:2px;
 background:rgba(255,255,255,.15); outline:none; cursor:pointer;
}
input[type=range]::-webkit-slider-thumb {
 -webkit-appearance:none; width:18px; height:18px;
 border-radius:50%; background:var(--tl-teal);
 border:2.5px solid #fff; cursor:pointer;
 box-shadow:0 2px 8px rgba(0,197,163,.5);
}
.results-grid {
 display:grid; grid-template-columns:1fr 1fr;
 gap:10px; margin:20px 0 20px;
 padding-top:20px; border-top:1px solid rgba(255,255,255,.1);
}
.res-box {
 background:rgba(255,255,255,.07);
 border-radius:var(--r); padding:14px 12px;
}
.res-label {
 font-size:10px; color:rgba(255,255,255,.4);
 text-transform:uppercase; letter-spacing:.07em; margin-bottom:6px;
}
.res-val {
 font-family:var(--font-head); font-size:1.3rem;
 font-weight:600; color:var(--tl-white);
}
/*.res-val.hi { color:var(--tl-teal) }*/
.calc-cta {
 display: block;
 width: 100%;
 text-align: center;
 padding: 13px;
 border-radius: var(--r2);
 background: var(--tl-teal);
 color: #fff;
 font-weight: 600;
 font-size: 14px;
 cursor: pointer;
 transition: all .18s;
 border: none;
 font-family: var(--font-body);
 padding: 21px 41px;
 border-radius: 50px;
}
.calc-cta:hover { background:var(--tl-teal-dark) }

/* ─── ADD-ONS ───────────────────────────────────────────── */
.addon-section { background:var(--tl-white) }
.addons-grid {
 display:grid !important; grid-template-columns:repeat(auto-fit,minmax(190px,1fr));
 gap:14px; margin-top:40px;
}
.addon-card {
 background:var(--tl-off-white); border:1.5px solid var(--tl-light-gray);
 border-radius:var(--r2); padding:18px 16px;
 transition:all .2s;
}
.addon-card:hover {
 border-color:var(--tl-teal); background:var(--tl-teal-light);
 box-shadow:var(--sh-sm);
}
.addon-icon-wrap {
 width:40px; height:40px; border-radius:var(--r);
 display:flex; align-items:center; justify-content:center;
 margin-bottom:12px; font-size:18px;
}
.addon-name { font-size:15px; font-weight:600; color:var(--tl-heading); margin-bottom:3px }
.addon-price {
 font-family:var(--font-head); font-size:1.3rem;
 font-weight:600; color:var(--tl-teal); margin-bottom:6px;
}
.addon-desc { font-size:12px; color:#6b7a90; line-height:1.5 }

/* ─── TESTIMONIALS ──────────────────────────────────────── */
.proof-section { background:var(--tl-off-white) }
.testi-grid {
 display:grid; grid-template-columns:repeat(auto-fit,minmax(280px,1fr));
 gap:18px; margin-top:40px;
}
.testi-card {
 background:var(--tl-white); border-radius:var(--r2);
 border:1px solid var(--tl-light-gray);
 padding:22px 20px; box-shadow:var(--sh-sm);
 min-height:365px;
}
.testi-stars { color:var(--tl-yellow); font-size:14px; letter-spacing:2px; margin-bottom:12px }
.testi-quote {
 font-size:13px; color:var(--tl-body-text);
 line-height:1.7; margin-bottom:18px; font-style:italic;
}
.testi-author { display:flex; align-items:center; gap:12px }
.testi-avatar {
 width:38px; height:38px; border-radius:50%;
 display:flex; align-items:center; justify-content:center;
 font-size:14px; font-weight:600; color:#fff; flex-shrink:0;
}
.testi-name { font-size:13px; font-weight:600; margin:0px; }
.testi-role { font-size:11px; color:#6b7a90 }

/* ─── FAQ ───────────────────────────────────────────────── */
.faq-section { background:var(--tl-white) }
.faq-grid {
 display:grid; grid-template-columns:1fr 1fr;
 gap:14px; margin-top:40px;
}
@media(max-width:720px){ .faq-grid { grid-template-columns:1fr } }
.faq-item {
 border:1.5px solid var(--tl-light-gray);
 border-radius:var(--r2); overflow:hidden;
 background:var(--tl-white);
}
.faq-q {
 padding:16px 18px; font-size:13px; font-weight:700;
 color:var(--tl-heading); cursor:pointer;
 display:flex; justify-content:space-between; align-items:center;
 gap:12px; transition:background .15s;
}
.faq-q:hover { background:var(--tl-off-white) }
.faq-icon {
 width:24px; height:24px; border-radius:50%;
 background:var(--tl-teal-light); color:var(--tl-teal);
 display:flex; align-items:center; justify-content:center;
 font-size:14px; font-weight:600; flex-shrink:0;
 transition:transform .2s; line-height:1;
}
.faq-q.open .faq-icon { transform:rotate(45deg) }
.faq-a {
 padding:0 18px 16px; font-size:12px; color:#5a6a80;
 line-height:1.7; display:none;
}
.faq-a.open { display:block }

/* ─── FINAL CTA ─────────────────────────────────────────── */
.final-cta-section {
 background:var(--tl-navy); padding:72px 0;
 text-align:center; position:relative; overflow:hidden;
 border-radius:10px;
}

.final-cta-inner { position:relative; z-index:1 }
.final-cta-section h2 {
 font-size:clamp(1.8rem,4vw,2.9rem); color:var(--tl-white);
 margin-bottom:16px;
}
.final-cta-section h2 em { color:var(--tl-teal); font-style:normal }
.final-cta-section p {
 font-size:18px; color:rgba(255,255,255);
 max-width:460px; margin:0 auto 36px; line-height:1.7;
}
.final-btns { display:flex; gap:14px; justify-content:center; flex-wrap:wrap }
.final-trust {
 font-size:12px; color:rgba(255,255,255,.7);
 margin-top:22px; line-height:1.7;
}

/* ─── FOOTER (matches timelabs footer) ─────────────────── */
footer {
 background:var(--tl-navy-dark);
 border-top:1px solid rgba(255,255,255,.07);
 padding:24px 0;
}
.footer-inner {
 display:flex; align-items:center;
 justify-content:space-between; gap:20px; flex-wrap:wrap;
}
.footer-links {
 display:flex; gap:18px; flex-wrap:wrap;
}
.footer-links a {
 font-size:12px; color:rgba(255,255,255,.35);
 transition:color .15s;
}
.footer-links a:hover { color:rgba(255,255,255,.75) }
.footer-cities { font-size:12px; color:rgba(255,255,255,.25) }
.footer-copy { font-size:12px; color:rgba(255,255,255,.25) }

/* ─── ANIMATIONS ────────────────────────────────────────── */
.fade-up {
 opacity:0; transform:translateY(22px);
 transition:opacity .55s ease, transform .55s ease;
}
.fade-up.show { opacity:1; transform:none; }

/* ─── custom ─────────────────────────────────────────── */
header .menu-main{background: transparent;}
header .navbar ul li .feather-home{color:#ff9e2c;}
header .navbar ul li a.menu-link {color: #ffffff !important;}
.brand-logo{display:none}
.brand-logo-2{display:block}
header.darkHeader .brand-logo {display: block;}
header.darkHeader .brand-logo-2 {display: none;}
header.darkHeader .navbar ul li a.menu-link {color: #333333 !important;}
header nav .header-btn{display:none;}
.header nav .header-btn{display:none;}
.talkexpert { white-space: nowrap; margin-left: 10px; display: flex; color: #ffff; border-radius: 50px; border: 2px solid #fff; min-width: 193px; padding: 5px 12px; font-weight: 500; column-gap: 5px; }
header.darkHeader .talkexpert {border-color: #333;color: #333;}
header.darkHeader .talkexpert img{ filter: brightness(0) saturate(100%);}
.trustedclients .owl-nav{display:none;}
.clientstestimonials .client-details h3{font-size:16px; text-align:left;}
.client-details img {width: 100px !important;object-fit: contain;}
.trustedclients .clientname p {text-align: left;margin-top: 10px;}
.clientstestimonials .about-client{align-items:flex-start;}
.trustedclients .client-card{padding:0px;}
.trustedclients{margin-top:15px;}
a.view-more {margin-left: 10px; color: #000;}
.connectWithDataTesti .owl-stage-outer {margin-bottom: 15px;}
.trustedclients {margin-top: 40px;}
div#connectdiv {display: none;}
.gpanel .panel-heading {font-size: 20px;font-weight: 700;color: var(--tl-heading); font-family:'Plus Jakarta Sans', sans-serif;}
.faq-section .panel-body , .faq-section .panel-body li{font-size:16px; font-family: 'Plus Jakarta Sans', sans-serif; font-weight: 400; color: #000000E5;}
.faq-section .gpanel .panel-heading {color:#333;}
.menu li.menu-item:hover > a, header .navbar ul li a.menu-link.active{color:#ff9e2c !important}
.pricingBox.desktopView {margin-top: 50px;}
.faq-section .gpanel {margin-top: 50px;}
.modulename span{font: 500 18px / 5px "Poppins", sans-serif;}
.moduleHead b.head{font: 500 18px / 15px "Poppins", sans-serif;}
.modulename p, .moduleHead p{font: 400 12px / 14px "Poppins", sans-serif;}
.moduleHead{row-gap:0px;}
.pricingBodyDataInner > div{height:auto;}
.priceHead p{font-size:14px;}
.parentInner p{font-size:13px; line-height:normal;}
.pricingHeader > div, .pricingBodyDataInner > div{padding:1px 15px;}
.pricingBodyDataInner:last-child > div {border-bottom: 1px solid #eaeaea;}
header .nav-menu{max-width:1380px;}
iframe#kiwi-big-iframe-wrapper {display: none;}
.whatsappFramOpener {display: none;}
.connect-cta{margin-top:30px;}
.section-sub-own{font-size:14px; margin-bottom:20px; margin-left:auto; margin-right:auto;}
.parentHead > div:last-child, .pricingBodyDataInner > div:last-child{display:none;}

.full-layout{display:flex;justify-content:center; align-items:center; text-align:center}
.full-layout .hero-sub{max-width:100%; width:100%;}
.docheading {
 font-size: clamp(32px, 2.6vw, 50px);
 color: #343A40;
 column-gap: 15px;
 line-height: 60px;
 letter-spacing: -1%;
 font-weight: 700;
 font-family: 'Plus Jakarta Sans',sans-serif;
 display: flex;
 text-align: center;
}
.docheading img{display: none}
.hr-docs { display: flex; flex-wrap: wrap; justify-content: space-between; row-gap: 15px; column-gap: 7px; margin-top:30px;}
.hr-docs li a img {width: 48px; height: 48px;}
 .hr-docs li a {
 border: 1px solid #E1E6F4;
 display: flex;
 align-items: center;
 column-gap: 7px;
 padding: 10px 20px 10px;
 min-width: 464px;
 border-radius: 24px;
 color: #131927;
 font-family: 'Plus Jakarta Sans',sans-serif;
 font-weight: 600;
 line-height:24px;
 font-size: 20px;
 max-width: 300px;
 height: 88px;
 width: 464px;
 white-space: nowrap;
 background: #FFFFFF;
 }
.hr-docs li {min-width: 25%; max-width: 25%;}
.hrdoc-logo .brand-section {background: transparent !important;}
.hr-docs li a:hover {color: #0F4F93; background: #E6F3FF;}

.hrdoc-section {
 background: #F7F9FD;
 padding: 100px 0px 100px;
}
.policydoc-section{padding: 40px 0px 60px;}
.banner-bredcurm {
 display: flex;
 color: #1E40AF;
 justify-content: flex-start;
 column-gap: 5px;
 flex-wrap: wrap;
 font-size: 20px;
 line-height: 24px;
 font-weight: 600;
 font-family: 'Plus Jakarta Sans', sans-serif;
}

 .banner-bredcurm li a:hover, .banner-bredcurm li a.active {
 color: #101828;
 }
.details-left-inner {
 background: #FFFBF7;
 padding: 1px 20px 15px;
 border-radius: 14px;
}
.count-row ul {display: flex; align-items: center; column-gap: 13px;}
.count-row ul li i {color: #000;}
.count-row ul li {border-right: 1px solid #000; padding-right: 10px; line-height: normal;}
.count-row ul li:last-child {border-right: none;}
.details-mid h4 {color: #2C2C2C; margin-top: 3rem; margin-bottom: 2rem;}
.forum-box {border: 1px solid #F5D08D;background: #FFEFD3;border-radius: 10px;margin-top: 30px; display:flex; column-gap:15px;overflow:hidden; align-items:center;}
.lastupdate {display: flex;justify-content: flex-end;}
.forum-box h5 {font-size: 20px;font-weight: 500;color: #2C2C2C;}
.forum-box p{color:#2C2C2C}
.details-main {display: flex; column-gap: 25px;position:relative;}
.details-right {min-width: 360px; margin-top: 143px;}
.details-right-inner {
 background: #FFFFFF;
 padding: 15px;
 border-radius: 10px;
 margin-bottom: 15px;
 position: sticky;
 top: 100px;
 width: 412px;
 
}
ul.similar-list {
 overflow: auto;
 
}
.policy-search {
/* width: 402px;
 height: 60px;*/
 display: flex;
 align-items: center;
 gap: 8px;
 padding: 15px;
 border: 1px solid #E5E7EB;
 border-radius: 15px;
 background: #fff;
 margin-bottom: 20px;
 box-sizing: border-box;
}

 .policy-search i {
 font-size: 18px;
 color: #0E120199;
 flex-shrink: 0;
 }

 .policy-search input {
 flex: 1;
 border: none;
 outline: none;
 background: transparent;
 font-family: "Plus Jakarta Sans", sans-serif;
 font-weight: 400;
 font-size: 13px;
 line-height: 20px;
 color: #0E1201;
 }

 .policy-search input::placeholder {
 color: #0E120199;
 font-family: "Plus Jakarta Sans", sans-serif;
 font-weight: 400;
 font-size: 13px;
 line-height: 20px;
 }
.new-innersection {
 background: url(../images/mailformatbg.png) center no-repeat;
}
.similar-list li a {display: flex; align-items: center; column-gap: 10px; margin-bottom:15px; border-left: 2px solid transparent; padding: 5px;}
.similar-list li a p span {display: flex;font-size:12px;}
.similar-list li a p {margin: 0px;}
.similar-list li a p span.list-title {color: #2C2C2C; font-weight: 500; font-size:14px;}
.similar-list li a p span.list-date {color: #888888;}
.details-right-inner h3.docheading {margin-top: 5px; margin-bottom: 15px;}
.similar-list li a.active span.list-title, .similar-list li a:hover span.list-title {color: #0F4F93;}
.similar-list li a:hover img {filter: brightness(0) saturate(100%) invert(19%) sepia(95%) saturate(1418%) hue-rotate(192deg) brightness(97%) contrast(91%);}
.similar-list li a.active, .similar-list li a:hover {background: #fff; border-left: 2px solid #49A1FF;border-radius: 5px;}
.forum-right {min-width: 397px;margin-right: 0px;}
.forum-left {padding: 15px;}
.pricingBodyDataInner > div{min-height: 4.3rem;}
.micro-strip-text {text-align: center; max-width: 800px; margin-left: auto; margin-right: auto;}
.micro-strip-text h2{color:#fff !important;}
.modulename {
 display: flex;
 align-items: flex-start;
 justify-content: space-between;
 flex-direction: column;
 padding-bottom: 10px !important;
}
.light-blue-btn{border: 1px solid #006ffa !important;}
.parentInner p{padding-left:48px !important}
.parent.active .priceHead p:after{left:18px !important}
.priceHead.active p, .priceHead.cursor:hover i, .priceHead.cursor:hover p, .priceHead.cursor i{color:#000;}
.modulename p {
 position: absolute;
 top: 36px;
}
.compareall {
 display: flex;
 align-items: center;
 justify-content: center;
 margin-top: 30px;
}
 .compareall a {
 display: inline-flex; align-items: center; justify-content: center; gap: 8px;
 background: var(--tl-teal); color: var(--tl-white);
 text-decoration: none;
 font-size: 15px; font-weight: 600;
 padding: 15px 32px; border-radius: 50px;
 box-shadow: 0 4px 16px rgba(30,64,175,.25);
 transition: all .18s;
 }
 .compareall a:hover { background: var(--tl-teal-dark); color: var(--tl-white); transform: translateY(-1px) }
.pdf-editer {
 padding: 10px;
}
.details-left {
 width: 100%;
}
.pdfbox {
 /* border: 1px solid #dbdfe3; */
 border-radius: 5px;
 margin-top: 30px;
}
 .pdfbox h4 {
 color: #343A40;
 line-height: 32px;
 font-size: 25px;
 font-weight: 700;
 font-family: 'Plus Jakarta Sans', sans-serif;
 letter-spacing: 0%;
 margin-bottom: 24px;
 }


.pdfbox-inner {
 background: #f5f7f9;
 display: flex;
 align-items: center;
 justify-content: flex-end;
 padding: 5px 10px;
}

.hrpolicymodal .modal-body {border: 1px solid #F8F9FA; border-radius: 15px; background:#FFEDDE}
.hrpolicymodal .modal-content {border-radius: 15px;}
.hrpolicymodal .modal-body h2 {color: #0A3A7C !important; font-size: 24px !important; position: relative;}
.hrpolicymodal .modal-body h2:after {content: ""; width: 100px; position: absolute; height: 2px; background: #FF9D2C; bottom: 10px;}
.hrpolicymodal .modal-body .form-group label {font: normal 500 15px / 20px "Poppins", sans-serif !important;}
.hrpolicymodal .contact-form input, .hrpolicymodal .contact-form select {border: 1px solid #DCDFE3 !important; border-radius: 10px; font-size:14px;}
.hrpolicymodal .country-mobile-code{display: flex;}
.hrpolicymodal .country-mobile-code select{border-right: 0 !important;border-radius: 10px 0px 0px 10px !important;padding-left:10px !important}
.hrpolicymodal .country-mobile-code input{width:100% !important; border-left: none !important; border-radius: 0px 10px 10px 0px !important;}
.hrpolicymodal .form-check {display: flex;align-items: center;column-gap: 10px;}
.hrpolicymodal .form-check .form-check-input { font-size: 11px !important; height: 17px !important; width: 17px !important; }
.hrpolicymodal .form-check .form-check-label {margin: 0px !important; font-size: 15px !important; font-weight: 500 !important;}
.hrpolicymodal span.policy {font-weight: 500 !important;}
.hrpolicymodal .modal-body .form-group label.is-invalid { margin-top: 3px; font-weight: 400 !important; font-size: 14px !important; }
form.contact-form .country-mobile-code input {width: 74.33% !important; display: inline-block;}
form.contact-form .country-mobile-code select{width:25% !important}
.hrpolicymodal .light-blue-btn{width: 100%;background: #0A3A7C !important;}
.hrpolicymodal .light-blue-btn:hover{color:#fff !important}
ul.similar-list {;overflow: auto; max-height:100dvh;}
.page-pera{font-size:16px;}
#webinarmodal button.close { background: #35e3ea; position: absolute; right: -6px; top: -10px; border-radius: 50px; padding: 10px; width: 25px; height: 25px; display: flex; align-items: center; justify-content: center; font-size: 17px; }
.resiterbox { background: #031d65; width: 100%; display: block; margin-top: -1px; text-align: center; color: #fff; padding: 10px; }
.mobile-list-btn{display:none;}
.details-left .section-title {
 font-size: 50px;
 font-weight: 700;
 color: #343A40 !important;
 margin-bottom: 14px;
 margin-top: 0px;
 line-height: 60px;
 font-family: 'Plus Jakarta Sans', sans-serif;
}
.section-title span {
 color: #1E40AF !important;
}

.cta-navy:focus {color: #fff; border: none !important; outline: none;}
.docheading span span {
 font-weight: 700;
 font-size: 50px;
 letter-spacing: -1%;
 font-family: 'Plus Jakarta Sans', sans-serif ;
 text-decoration: underline;
 color: #1E40AF;
}
.pdf-editer iframe{border: none; border-radius: 8px; width:100%; height:1130px;}



/* QUICK DECISION */
.qd-sec {
 padding: 58px 0 40px;
 text-align: center;
 background: linear-gradient(186deg, #FFF 7.45%, #F2F8FF 95.99%);
}

.qd-eyebrow {
 font-size: 13.5px;
 font-weight: 700;
 color: #1a5ec8;
 margin-bottom: 4px;
 display: block;
}

 .qd-eyebrow .bold-part {
 font-weight: 900;
 }

.qd-title {
 font-size: 14px;
 color: #555;
 font-weight: 400;
 margin-bottom: 32px;
}

/* QD Table */
.qd-table-wrap {
 overflow: hidden;
 border: 1px solid rgba(222, 231, 241, 1);
 margin-top: 30px;
}

.qd-thead {
 display: flex;
 background: #fff;
 border-bottom: 1px solid rgba(222, 231, 241, 1);
}

.qd-th {
 padding: 11px 16px;
 font-size: 15px;
 font-weight: 500;
 color: rgba(15, 79, 147, 1);
 text-align: left;
}

 .qd-th:nth-child(1) {
 flex: 2.2;
 }

 .qd-th:nth-child(2) {
 flex: 1.0;
 border-left: 1px solid rgba(222, 231, 241, 1);
 border-right: 1px solid rgba(222, 231, 241, 1);
 }

 .qd-th:nth-child(3) {
 flex: 3.0;
 }

.qd-tr {
 display: flex;
 align-items: center;
 background: #fff;
 border-bottom: 1px solid rgba(222, 231, 241, 1);
 transition: background 0.15s;
}

 .qd-tr:last-child {
 border-bottom: none;
 }

 .qd-tr:hover {
 background: #f8faff;
 }

.qd-td {
 padding: 13px 16px;
 font-size: 12.5px;
 min-height:75px;
 display:flex; align-items:center;
}

 .qd-td:nth-child(1) {
 flex: 2.2;
 display: flex;
 align-items: center;
 gap: 10px;
 }

 .qd-td:nth-child(2) {
 flex: 1.0;
 border-left: 1px solid rgba(222, 231, 241, 1);
 border-right: 1px solid rgba(222, 231, 241, 1);
 }

 .qd-td:nth-child(3) {
 flex: 3.0;
 font-size: 14px;
 color: #021124;
 line-height: 1.55;
 text-align:left;
 }

.ind-icon {
 width: 45px;
 height: 45px;
 border-radius: 8px;
 flex-shrink: 0;
 display: flex;
 align-items: center;
 justify-content: center;
 font-size: 15px;
}

.ic-g {
 background: #e6f4ea;
 color: #2e7d32;
}

.ic-r {
 background: #fdecea;
 color: #c62828;
}

.ic-b {
 background: rgba(220, 246, 238, 1);
 color: #e8eaf6;
}


.ic-sb {
 background: rgba(238, 237, 255, 1);
}

.ic-com {
 background: rgba(227, 241, 252, 1);
}
.ic-eo {
 background: rgba(243, 229, 245, 1);
}

.ic-o {
 background: #E3F1FC;
 color: #E3F1FC;
}

.ind-n {
 font-weight: 500;
 font-size: 14px;
 color: #0F4F93;
 display: block;
}
.ind-s {
 font-size: 12px;
 color: #021124;
 text-align: left;
}
.qd-td span {
 text-align: left;
}
.ind-icon img {
 max-width: 25px;
}
.tag-tl {
 display: flex;
 background: #E3F1FC;
 color: #0F4F93;
 border-radius: 10px;
 padding: 5px 12px;
 font-size: 10.5px;
 font-weight: 600;
 margin: 2px 2px;
 column-gap: 5px;
 align-items:center;
}
.tag-tl:before {
 content: "";
 height: 8px;
 width: 8px;
 background: #0F4F93;
 display: inline-block;
 border-radius: 50px;
}

.tag-kk {
 display: flex;
 background: #E3F1FC;
 color: #5C5C5C;
 border-radius: 10px;
 padding: 5px 12px;
 font-size: 10.5px;
 font-weight: 600;
 margin: 2px 2px;
 align-items: center;
 column-gap: 5px;
}
.tag-kk:before {
 content: "";
 height: 8px;
 width: 8px;
 background: #5C5C5C;
 display: inline-block;
 border-radius: 50px;
}
/* STATS ROW */
.stats-sec {
 background: #eef3fb;
 padding: 36px 0;
}

.stats-inner {
 display: flex;
 flex-wrap: wrap;
 column-gap: 15px;
 justify-content: center;
 align-items: center;
 margin: 30px 0px auto;
}

.vs-stat-box {
 flex: 1;
 padding: 30px 20px;
 text-align: center;
 background: #EDF3FE;
 border: 4px solid #E3EBFA;
 border-radius: 9px;
}


.stat-pre {
 font-size: 12px;
 font-weight: 500;
 color: #0F4F93;
 display: inline-block;
 margin-bottom: 3px;
}

.stat-num-in {
 font-size: 44px;
 font-weight: 600;
 color: #0F4F93;
 line-height: 1;
 display: inline-block;
 border-bottom: 3px solid #FF9E2C;
}

 .stat-num-in sup {
 font-size: 20px;
 vertical-align: top;
 margin-top: 15px;
 display: inline-block;
 }

.stat-lbl {
 font-size: 14px;
 color: #333333;
 margin-top: 7px;
 line-height: 1.45;
}
.section-title .d-block{display:block;}
/* COMPARE TABLE SECTION */
.cmp-sec {
 background: #ffffff;
 padding: 50px 0 50px;
}

.sec-hd {
 text-align: center;
 margin-bottom: 34px;
}

 .sec-hd h2 {
 font-size: 24px;
 font-weight: 800;
 color: #0d1b3e;
 line-height: 1.3;
 }

 .sec-hd h2 .orange {
 color: #e84a2f;
 }

.cmp-tbl-wrap {
 overflow-x: auto;
}

table.ct {
 width: 100%;
 border-collapse: separate;
 min-width: 480px;
 border-radius:14px;
}

.ct thead th {
 padding: 20px 0px;
 background: transparent;
 border-bottom: 1px solid #DEE7F1;
 border-radius: 10px 10px 0px 0px;
 border: 1px solid #DEE7F1;
}

 .ct thead th:first-child {
 width: 42%;
 text-align: left;
 padding: 14px 18px;
 font-size: 12px;
 font-weight: 600;
 color: #2D2E2F;
 }
.tl-hd img {
 max-width:100px;
 height:30px;
}
.ct-th-tl {
 text-align: center;
 border-top: 2px solid #ff9e2c !important;
 border-left: 2px solid #ff9e2c !important;
 border-right: 2px solid #ff9e2c !important;
 width:30%;
}

.ct-th-kk {
 background: #fff8f5;
 border: 1.5px solid #f5c5b0;
 border-bottom: none;
 padding: 14px 20px;
 text-align: center;
}

.tl-hd {
 display: flex;
 align-items: center;
 justify-content: center;
 gap: 7px;
 color: #fff;
 font-size: 13.5px;
 font-weight: 800;
}

 .tl-hd .tl-ico {
 width: 22px;
 height: 22px;
 background: #4a8fd4;
 border-radius: 4px;
 display: flex;
 align-items: center;
 justify-content: center;
 font-size: 11px;
 font-weight: 900;
 color: #fff;
 }

.kk-hd {
 font-size: 15px;
 font-weight: 900;
 color: #e84a2f;
}

 .kk-hd sup {
 font-size: 9px;
 }

.ct tbody tr:hover td {
 background: #f9fbff;
}

.ct tbody td {
 padding: 11px 18px;
 font-size: 12.5px;
 color: rgba(114, 114, 115, 0.9);
 vertical-align: middle;
 border-left: 1px solid #DEE7F1;
 border-bottom: 1px solid #DEE7F1;
}

 .ct tbody td.col-tl {
 text-align: center;
 background: #FFFAF5;
 border-left: 2px solid #FF9E2C;
 border-right: 2px solid #FF9E2C;
 font-weight: 600;
 font-size: 12.5px;
 }

 .ct tbody td.col-kk {
 text-align: center;
 font-size: 12.5px;
 background: rgba(243, 238, 254, 0.4);
 border-right: 1px solid #E1DBF6;
 }



.v-both {
 color: #0F4F93;
 font-weight: 500;
}

.v-strong {
 color: #7C46F1;
 font-weight: 500;
}
.col-tl .v-strong {
 color: #0d47a1;
 font-weight: 500;
}
.v-deep {
 color: #0d47a1;
 font-weight: 500;
}

.v-yes {
 color: #7C46F1;
 font-weight: 500;
}
.col-tl .v-yes {
 color: #0d47a1;
 font-weight: 500;
}

.v-no {
 color: #c62828;
 font-weight: 500;
}

.v-smart {
 color: #0F4F93;
 font-weight: 500;
}

.v-addon {
 color: #7C46F1;
 font-weight: 500;
}

.v-limited {
 color: #0F4F93;
 font-weight: 500;
}

.v-basic {
 color: #7C46F1;
 font-weight: 500;
}

.v-text {
 color: #7C46F1;
 font-weight: 500;
}

.col-tl-mid {
 border-radius: 0px 0px 10px 10px;
 border-bottom: 2px solid #FF9E2C !important;
}
td.col-tl-first, .col-kk-last {
 border-radius: 0px 0px 10px 10px;
}
/* PRICING SECTION */
.pricing-sec {
 background: linear-gradient(3deg, #FFF 7.45%, #F2F8FF 95.99%);
 padding: 60px 0 50px;
 text-align: center;
}

.vs-pill {
 display: inline-flex;
 align-items: center;
 gap: 10px;
 padding: 6px 16px;
 font-size: 12px;
 font-weight: 600;
 color: #0d1b3e;
 margin: 28px 0px;
}

.d-tl {
 width: 8px;
 height: 8px;
 border-radius: 50%;
 background: #0F4F93;
 display: inline-block;
}

.d-kk {
 width: 8px;
 height: 8px;
 border-radius: 50%;
 background: #7C46F1;
 display: inline-block;
}

.p-cards {
 display: grid;
 gap: 18px;
 justify-content: center;
 margin-top: 0;
 grid-template-columns: repeat(4, 1fr);
}
.p-cards > :nth-child(5) {
 grid-column: 2;
}
.p-cards > :last-child {
 grid-column: 3;
}
.p-card {
 background: linear-gradient(3deg, #FFF 7.45%, #F2F8FF 95.99%);
 border: 2px solid rgba(216, 233, 255, 1);
 border-radius: 12px;
 padding: 22px 20px;
 flex: 1;
 text-align: left;
 box-shadow: 0 2px 12px rgba(13,27,62,0.05);
}

.p-card-h {
 display: flex;
 align-items: center;
 gap: 8px;
 font-size: 14px;
 font-weight: 500;
 color: #0F4F93;
 margin-bottom: 16px;
 border-bottom: 1px solid #D8E9FF;
 padding-bottom: 10px;
}

.p-card-ico {
 width: 28px;
 height: 28px;
 border-radius: 7px;
 background: #eef2ff;
 display: flex;
 align-items: center;
 justify-content: center;
 font-size: 13px;
 color: #1a5ec8;
 flex-shrink: 0;
}

.p-row {
 display: flex;
 align-items: flex-start;
 gap: 8px;
 margin-bottom: 9px;
 font-size: 14px;
 color: #444;
}
.p-row.p-row1 {
 border-bottom: 1px solid #D8E9FF;
 padding-bottom: 15px;
 color:#0F4F93;
}
.p-row.p-row2{color:#7C46F1}

.p-bold {
 font-weight: 700;
 color: #0d1b3e;
}

.p-muted {
 font-weight: 500;
 color: #7a90b0;
}
.pricing-sec .section-sub {
 max-width: 700px;
}
.factors {
 color: #ff9e2c;
 text-transform: uppercase;
 font-weight: 500;
}

.hero-btns {
 display: flex;
 gap: 12px;
 justify-content: center;
 flex-wrap: wrap;
}

.btn-see {
 background: #0A3A7C;
 color: #fff;
 border-radius: 22px;
 padding: 10px 22px;
 font-size: 12.5px;
 font-weight: 600;
 border: none;
 display: inline-flex;
 align-items: center;
 gap: 7px;
 text-decoration: none;
}

 .btn-see:hover {
 background: linear-gradient(135deg,#2c62b5 0%,#1e4d9a 100%);
 color: #fff;
 text-decoration: none;
 }

.btn-demo {
 background: rgb(255 255 255);
 color: #0A3A7C;
 border: 1.5px solid rgba(255,255,255,0.35);
 border-radius: 22px;
 padding: 10px 22px;
 font-size: 12.5px;
 font-weight: 600;
 text-decoration: none;
 display: inline-flex;
 align-items: center;
}

 .btn-demo:hover {
 background: rgba(255,255,255,0.08);
 color: #fff;
 text-decoration: none;
 }
.best-choice{display:none;}

.client-logo-glossary .brand-section {
 position: inherit;
}
.glossary-hero .hero-sub{font-size: 18px;}
.hrtechsection {
 text-align: left;
 background: linear-gradient(186deg, #FFF 7.45%, #F2F8FF 95.99%);
}
.hrtechsection h2{
 font-weight:600;
 margin-top:0px;
}
.hrtechsection h4 {
 color: #333333;
 margin: 20px 0px 14px;
 font-size:20px;
}
.hrtechsection ul li {
 position: relative;
 padding-left: 20px;
 margin-bottom: 15px;
 font-size:16px;
}
.hrtechsection ul li::before {
 content: "";
 background-image: url(https://d1e4eypuuiznsv.cloudfront.net/wwwroot/images/check_icon.svg);
 height: 16px;
 width: 16px;
 display: inline-block;
 background-size: cover;
 position: absolute;
 top: 5px;
 left: -3px;
}
.hrtechsection p{font-size:16px;}

.quicksearch {
 width: 300px;
 padding: 7px 10px 10px 34px;
 border-radius: 8px;
 border: 1px solid #ddd;
}
.quicksearch:focus{border: 1px solid #ddd; outline:none;}

.alphabet-filter {
 margin-bottom: 20px;
 box-shadow: 0 2px 8px rgba(0, 0, 0, 0.05);
 padding: 4px;
 border: 1px solid #f4f2f2;
 border-radius: 5px;
}

 .alphabet-filter button {
 margin: 2px;
 padding: 6px 10px;
 border: none;
 border-radius: 6px;
 cursor: pointer;
 background: transparent;
 }

 .alphabet-filter button.active {
 background: #0F4F93;
 color: #fff;
 }

.gridglossary {
 max-width: 1380px;
}

.element-item {
 width: 32.333%;
 background: #fff;
 padding: 15px;
 border-radius: 14px;
 box-shadow: 0 2px 8px rgba(0,0,0,0.05);
 margin-bottom: 15px;
 border:1px solid #DBDFEA80;
}

.element-item h3, .element-item h4 {
 margin: 0 0 10px;
 color: #2C2C2C;
 font-size: 18px;
 font-weight: 500;
}
.element-item strong {
 font-size: 13px;
 font-weight: 600;
} 
.element-item p{
 font-size:13px;
}
.glossar-row {
 display: flex;
 justify-content: space-between;
 align-items: center;
 column-gap: 15px;
}
.glossar-h h2 {
 margin-bottom: 4px;
 font-weight: 600;
}
.glossar-search{position:relative;}

.glossar-search::before {
 content: "\e9c1";
 font-size: 18px;
 font-family: 'feather' !important;
 position: absolute;
 left: 11px;
 color: #7e7975;
 height: 20px;
 width: 20px;
 z-index: 1;
 top: 6px;
}

.no-result {
 min-height: 60px;
 display: block;
 align-items: center;
 text-align: center;
}
.glossary-download, .glossary-download:hover, .glossary-download:focus {
 background: #FF9E2C;
 color: #fff;
}
.comp-left{text-align:left;}
.comp-left .hero-btns{justify-content:flex-start;}
.vs-images-mob{display:none;}
.comp-hero{padding:30px 0px;}
/* ─── RESPONSIVE ─────────────────────────────────────────── */
@media screen and (min-width: 991px) and (max-width: 1280px) {
 header .nav-menu {
 width: auto !important;
 }
}
@media(max-width:1199px) {
.qd-thead{display:none;}
.qd-tr{display:block;}
 .qd-table-wrap {display: grid; grid-template-columns: 1fr 1fr; gap: 20px;border:none;}
.qd-td:nth-child(2) { border: none; min-height: auto; padding-top: 0; padding-bottom: 0; }
 .qd-tr, .qd-tr:last-child{border: 2px solid #F1F1FF; border-radius: 14px;box-shadow: 0 2px 12px rgba(13, 27, 62, 0.05);}
 .p-cards{display: grid; grid-template-columns: repeat(3, 1fr)}
 .best-choice{display:block;}
.qd-td:nth-child(2) {
 flex-direction: column;
 justify-content: flex-start;
 align-items: flex-start;
 border-top: 1px solid #DEE7F1;
 padding-top: 15px;
}
 .best-choice {
 color: #0F4F93;
 font-weight: 500;
 font-size: 13px;
 margin-bottom: 4px;
}
 .vs-stat-box{min-height:165px;}
 .element-item{width: 30.333%}
}
@media(max-width:991px) {
 header .burger{top:-3px;}
.parentHead > div:last-child, .pricingBodyDataInner > div:last-child{display:block;}
header .burger-line{background:#fff}
header.darkHeader .burger-line{background:#333}
.brand-section{padding:20px 0px 20px;}
/*.hero{padding:50px 0px 56px;}*/
.hero{padding: 80px 20px 56px}
.pricingBox.mobileView {margin-top: 30px;}
.pricingBox.mobileView .pricingHeader > div{row-gap:10px;}
.pricingBox.mobileView .moduleHead b.head {font: 500 20px / 34px "Poppins", sans-serif;}
.trustedclients .owl-nav { width: 100%;top: 40%;}
.trustedclients .owl-carousel .owl-nav button.owl-next, .trustedclients .owl-carousel .owl-nav button.owl-prev{width:25px; height:25px;font-size:20px;}
.trustedclients .owl-nav{display:flex}
.trustedclients .owl-dots{display:none}
.owl-carousel .owl-nav button.owl-next, .owl-carousel .owl-nav button.owl-prev{height:25px; width:25px;}
.testi-card{padding:22px 35px}
.plans-grid {display: flex !important; overflow-x: auto; margin-top:15px;}
.plan-card{min-width:260px;margin-top: 15px;}
.recommended-strip{justify-content:center !important;}
.plans-grid::-webkit-scrollbar {display: none;}
.plans-grid {scrollbar-width: none; -ms-overflow-style: none;}
header .navbar ul li a.menu-link{ color: #0F4F93 !important;}
.talkexpert {position: absolute;right: 50px;}
.hero h1{line-height:normal;}
.details-right{display:none; position:absolute; top:12.7rem; right:0px;}
.hr-docs li a{font-size:14px;}
.hr-docs li a img {width: 2.3rem;}
.page-pera {font-size: 14px;}
.mobile-list-btn{display:block;}
.lastupdate {display: flex;justify-content: space-between; align-items: center; margin-bottom: 10px;}
.details-right-inner h3.docheading{display:none;}
.details-right-inner{box-shadow: 0px 5px 15px 5px rgb(0 0 0 / 8%);background:#fff;padding-right:0px;}
.similar-list li a img {width: 30px;}
.similar-list li a{margin-bottom:5px;}
.webinarbox{display:none;}
.details-right {min-width: 315px;}

.details-right:before{content: ""; position: absolute; right: 25px; transform: rotate(0deg); top: -23px !important; bottom: auto !important; }
.details-right:after{content: "";
 position: absolute;
 right: 25px;
 transform: rotate(0deg);
 bottom: auto !important;
 border: 12px solid transparent;
 border-bottom-color: #eee;
 top: -25px !important;

}
 /* Android */
 .android .pdf-editer::before {
 display: block;
 }

 /* iOS */
 .ios .pdf-editer::before {
 display: none;
 }
 .vs-images-mob{display:block; max-width:400px; margin-bottom:40px; margin-left:auto; margin-right:auto;width:90%;}
 .comp-right{display:none}
 .comp-left {text-align: center;}
 .comp-left .hero-btns {justify-content: center;}
 .comp-hero{padding:0px 0px;}
}

@media(max-width:960px) {
 .hero-layout { grid-template-columns:1fr; gap:40px }
 .hero-sub { max-width:100% }
 .talkexpert span{display:none}
 .talkexpert{min-width:52px;}
 
}
@media(max-width:700px){
 .hero .pricing-hero-title {
 font-size: clamp(30px, 8.6vw, 36px);
 line-height: 1.14;
 margin-bottom: 24px;
 }

/* Production QA fixes for comparison table alignment */
.pricingBox.desktopView {
 position: relative;
 isolation: isolate;
 overflow-x: auto;
 padding-top: 0;
}

.pricingBox.desktopView .pricingHeader {
 position: sticky;
 top: 76px;
 z-index: 20;
 background: #ffffff;
 box-shadow: 0 8px 18px rgba(15, 79, 147, .08);
}

.pricingBox.desktopView .pricingHeader > div {
 min-height: 190px;
 align-items: center;
 justify-content: center;
}

.pricingBox.desktopView .pricingBodyDataInner {
 position: relative;
 z-index: 1;
}

.pricingBox.desktopView .parentHead {
 position: relative !important;
 z-index: 2;
 top: auto !important;
}

.pricingBox.desktopView .parentHead > div,
.pricingBox.desktopView .pricingBodyDataInner > div {
 min-height: 64px;
 padding: 12px 18px;
}

.pricingBox.desktopView .priceHead p,
.pricingBox.desktopView .parentInner p {
 line-height: 1.45 !important;
}

.pricingBox.desktopView .modulename p {
 position: static;
 margin-top: 6px;
}
 .hero .pricing-hero-title span,
 .hero .pricing-hero-title em {
 max-width: 340px;
 margin-left: auto;
 margin-right: auto;
 }
 .hero .pricing-hero-title em {
 margin-top: 6px;
 }
 .section-sub{font-size:16px;}
 .cost-calc-sub{font-size:14px !important;}
 .hero-badge{font-size:11px;}
 .hero-stats { gap:20px }
 .hero-sub {font-size:16px; }
 .plans-grid { grid-template-columns:1fr }
 .micro-strip { flex-direction:column; text-align:center }
 .nav-links { display:none }
 .section-pad { padding:48px 0 }
 .faq-section .gpanel{margin-top:0px;}
 .btn-primary-lg, .hero-ctas .btn-ghost-white{padding: 14px 14px !important;}
 .comp-stat{padding:0px 15px;}
 .micro-strip-text p{font-size:14px;}
 .qd-table-wrap{grid-template-columns: 1fr;}
 .qd-sec{padding: 20px 0 40px;}
 .qd-td:nth-child(1){display:block;text-align:left;}
 .ind-icon{margin-bottom:10px}
 .qd-sec .col-sm-12, .cmp-sec .col-sm-12, .pricing-sec .col-sm-12 {
 padding: 0px;
 }
 .p-cards {
 display: flex;
 flex-wrap: wrap;
 flex-direction: column;
 }
 .stats-inner{display:block;}
 .vs-stat-box {min-height: auto; margin-bottom: 10px;}
 .tl-hd img {max-height: 14px;}
 .ct tbody td{padding: 10px 5px;}
 .ct-th-tl, .ct-th-kk {width:30%;}
 .hero-btns a {width: 100%; text-align: center; justify-content: center;}
 table.ct{display:contents;}
 .glossary-hero .hero-sub {
 font-size: 15px;
}
 .hrtechsection p, .hrtechsection ul li {
 font-size: 14px;
}
 .hrtechsection h4{font-size:18px;}
 .glossar-h h2 {
 margin-top: 0;
 font-size: 20px;
 text-align: center;
 }
 .glossar-row{flex-direction:column; margin-bottom:15px;}
 .element-item {
 width: 100%
 }
}

/* EMPLOYEE COST CALCULATOR */
.cost-calc-section {
 background: var(--tl-off-white);
 padding: 64px 0;
 position: relative;
 overflow: hidden;
}
.cost-calc-section::before {
 content: '';
 position: absolute; top: -160px; right: -100px;
 width: 420px; height: 420px; border-radius: 50%;
 background: radial-gradient(circle, rgba(30,64,175,.06) 0%, transparent 70%);
 pointer-events: none;
}
.cost-calc-section::after {
 content: '';
 position: absolute; bottom: -80px; left: -60px;
 width: 280px; height: 280px; border-radius: 50%;
 background: radial-gradient(circle, rgba(30,64,175,.04) 0%, transparent 70%);
 pointer-events: none;
}
.cost-calc-inner {
 position: relative; z-index: 1;
 max-width: 820px; margin: 0 auto;
 text-align: center;
}
.cost-calc-inner .eyebrow { color: var(--tl-teal); justify-content: center }
.cost-calc-inner .eyebrow::before { background: var(--tl-teal) }
.cost-calc-title {
 font-family: var(--font-head);
 font-size: clamp(1.6rem, 3.2vw, 3.7rem);
 font-weight: 700; color: var(--tl-heading);
 margin-bottom: 10px; line-height: 1.15;
}
.cost-calc-title span { color: var(--tl-teal) }
.cost-calc-sub {
 font-size: 20px; color: var(--tl-mid-gray);
 margin-bottom: 40px; line-height: 1.6;
}

/* the main input row */
.emp-input-row {
 display: flex; align-items: center; gap: 0;
 background: var(--tl-off-white);
 border: 1.5px solid var(--tl-off-white);
 border-radius: 50px;
 padding: 8px 8px 8px 24px;
 margin-bottom: 28px;
 transition: border-color .2s;
}
.emp-input-row:focus-within {
 border-color: var(--tl-teal);
}
.emp-input-label {
 font-size: 14px; font-weight: 500; color: var(--tl-mid-gray);
 white-space: nowrap; flex-shrink: 0;
}
.emp-number-input {
 flex: 1; background: transparent; border: none; outline: none;
 font-family: var(--font-head);
 font-size: 1.4rem; font-weight: 700; color: var(--tl-heading);
 text-align: left; min-width: 60px; max-width: 160px;
 padding: 4px 8px;
 -moz-appearance: textfield;
}
.emp-number-input::-webkit-outer-spin-button,
.emp-number-input::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0 }
.emp-input-suffix {
 font-size: 13px; font-weight: 600; color: var(--tl-mid-gray);
 flex-shrink: 0; padding-right: 8px;
}
/* Figma: a plain white pill button sitting inset within the light gray row, not a solid teal CTA */
.emp-calc-btn {
 display: inline-flex; align-items: center; justify-content: center; gap: 8px;
 background: #fff;
 color: var(--tl-heading);
 font-family: var(--font-body);
 font-size: 14px;
 font-weight: 600;
 border: 1px solid #E1E6F4;
 border-radius: var(--r2);
 padding: 15px 28px;
 cursor: pointer;
 transition: all .18s;
 white-space: nowrap;
 flex-shrink: 0;
 border-radius: 50px;
}
.emp-calc-btn:hover { border-color: var(--tl-teal); color: var(--tl-teal); transform: translateY(-1px) }

/* slider */
.emp-slider-wrap {
 display: flex; align-items: center; gap: 14px;
 margin-bottom: 36px;
 /* room above the track for the floating tooltip */
 padding-top: 36px;
}
.slider-track-wrap { position: relative; flex: 1; display: flex; align-items: center }
.emp-slider-wrap input[type=range] {
 width: 100%; height: 8px;
 background: var(--tl-light-gray);
 border-radius: 4px;
}
.emp-slider-wrap input[type=range]::-webkit-slider-thumb {
 width: 18px; height: 18px;
 background: var(--tl-teal);
 border: 3px solid #fff;
 box-shadow: 0 2px 10px rgba(30,64,175,.35);
}
.emp-slider-wrap input[type=range]::-moz-range-thumb {
 width: 18px; height: 18px;
 background: var(--tl-teal);
 border: 3px solid #fff;
 box-shadow: 0 2px 10px rgba(30,64,175,.35);
}
/* percentage bubble that tracks the thumb, Figma "Tooltip / Top floating" */
.slider-tooltip {
 position: absolute; bottom: calc(100% + 10px); left: 26%;
 transform: translateX(-50%);
 background: #fff; color: var(--tl-heading);
 font-size: 12px; font-weight: 700;
 padding: 6px 12px; border-radius: 8px;
 box-shadow: 0 10px 30px rgba(0,0,0,.08), 0 4px 10px rgba(0,0,0,.06);
 white-space: nowrap; pointer-events: none;
}
.slider-tooltip::after {
 content: ''; position: absolute; top: 100%; left: 50%;
 transform: translateX(-50%);
 border: 5px solid transparent; border-top-color: #fff;
}
.slider-tick {
 font-size: 11px; font-weight: 700;
 color: var(--tl-mid-gray); flex-shrink: 0;
 min-width: 36px; text-align: center;
}

/* results grid */
.cost-results-grid {
 display: grid;
 grid-template-columns: repeat(3, 1fr);
 gap: 12px;
 margin-bottom: 28px;
}
@media(max-width:600px) {
 .cost-results-grid { grid-template-columns: 1fr }
 .emp-input-row { padding: 6px 6px 6px 14px }
 .emp-number-input { font-size: 1.5rem }
 .details-right{top: 14.7rem;}
}
.cost-result-card {
 border-radius: 24px;
 padding: 32px 28px;
 text-align: center;
 transition: all .2s;
 border: 1px solid #60A5FA;
 background: var(--tl-white);
 position: relative;
 overflow: hidden;
}
.cost-result-card > * { position: relative; z-index: 1 }
/* decorative fan on whichever card is currently "recommended" */
/* fanimage.svg is filled near-white (#ECF6FF) for use on dark backgrounds, so on
 this white card it's masked and tinted with a visible brand-blue instead */
.cost-result-card.recommended::before {
 content: '';
 position: absolute; top: -18px; right: -24px;
 width: 130px; height: 130px;
 background-color: #60A5FA;
 -webkit-mask: url('../images/fanimage.svg') no-repeat center / contain;
 mask: url('../images/fanimage.svg') no-repeat center / contain;
 opacity: .18; transform: rotate(20deg);
 pointer-events: none; z-index: 0;
}
/* Figma: default state is subtly bordered, not highlighted — the badge alone marks it as recommended */
.cost-result-card.recommended {
 background: var(--tl-white);
 border-color: #E1E8F4;
}
/* the blue emphasis border is a hover-only affordance, and stays hairline-thin */
.cost-result-card:hover {
 border-color: var(--tl-teal);
 box-shadow: 0 8px 28px rgba(30,64,175,.12);
}
.cost-result-card.dim-card {
 opacity: 1;
}
.crc-plan {
 display: flex; align-items: center; justify-content: center; gap: 6px;
 font-size: 10px; font-weight: 700; letter-spacing: .1em;
 text-transform: uppercase; margin-bottom: 10px;
}
.crc-plan::before {
 content: ''; width: 6px; height: 6px; border-radius: 50%;
 background: currentColor; flex-shrink: 0;
}
/* each plan keeps its own identity colour regardless of which card is "recommended" at a given headcount */
#crc-pulse .crc-plan { color: #E6960A }
#crc-rhythm .crc-plan { color: var(--tl-teal) }
#crc-momentum .crc-plan { color: #8b1a1a }
/* price and /month sit on one line in the design */
.crc-price {
 font-family: var(--font-head);
 font-size: 1.65rem; font-weight: 700; color: var(--tl-heading);
 line-height: 1; margin-bottom: 0;
 display: inline-block;
 transition: all .3s;
}
.cost-result-card.recommended .crc-price { color: var(--tl-heading) }
.crc-period { font-size: 12px; color: var(--tl-mid-gray); display: inline-block; margin-left: 3px }
/* short blue rule between the price and the per-employee line */
.crc-per-emp { font-size: 11px; color: var(--tl-mid-gray); margin-top: 0 }
.crc-per-emp::before {
 content: ''; display: block; width: 56px; height: 3px;
 background: var(--tl-teal); border-radius: 2px;
 margin: 10px auto 10px;
}
.crc-badge {
 display: inline-block; margin-top: 10px;
 font-size: 10px; font-weight: 700; letter-spacing: .04em;
 background: #E4EDFF; color: var(--tl-teal);
 padding: 5px 12px; border-radius: 99px;
}
.crc-upgrade-note {
 font-size: 10px; color: var(--tl-mid-gray);
 margin-top: 6px; line-height: 1.4;
}

/* recommended plan strip */
.recommended-strip {
 background: linear-gradient(135deg, var(--tl-navy) 0%, var(--tl-navy-dark) 100%);
 border: none;
 border-radius: var(--r2);
 padding: 16px 20px;
 display: flex; align-items: center; justify-content: space-between;
 gap: 16px; flex-wrap: wrap;
 margin-bottom: 0;
 transition: all .3s;
}
.rec-strip-left {
 display: flex; align-items: center; gap: 12px;
}
.rec-strip-icon {
 width: 40px; height: 40px; border-radius: 50%;
 background: var(--tl-teal); display: flex;
 align-items: center; justify-content: center;
 font-size: 16px; flex-shrink: 0;
}
.rec-strip-text { text-align: left }
.rec-strip-headline {
 font-size: 14px; font-weight: 700; color: #fff; line-height: 1.2;
}
.rec-strip-detail {
 font-size: 12px; color: rgba(255,255,255,.6); margin-top: 3px;
}
.rec-strip-cta {
 background: var(--tl-teal);
 color: #fff;
 font-family: var(--font-body);
 font-size: 13px;
 font-weight: 700;
 border: none;
 border-radius: var(--r2);
 padding: 21px 41px;
 cursor: pointer;
 transition: all .18s;
 white-space: nowrap;
 text-decoration: none;
 display: inline-block;
 flex-shrink: 0;
 border-radius: 50px;
}
.rec-strip-cta:hover { background: var(--tl-teal-dark); transform: translateY(-1px); color: #FFFFFF }


/*LeaderShip Css*/

/*.Principles-sec {
 background: url('../images/careerjoinbg.webp') center no-repeat;
 
}*/
.Principles-sec {
 position: relative;
 background: none;
}

 .Principles-sec::before {
 content: "";
 position: absolute;
 inset: 0;
 background: url('../images/careerjoinbg.webp') center no-repeat;
 background-size: cover;
 opacity: 0.1; 
 z-index: 0;
 }

 .Principles-sec > * {
 position: relative;
 z-index: 1;
 }
.leadership-hero-main {
 text-align: center;
 position: relative;
 z-index: 2;
}

 .leadership-hero-main .leadership-hero-badge {
 display: inline-block;
 padding: 8px 18px;
 border-radius: 30px;
 background: rgba(255,255,255,0.10);
 border: 1px solid rgba(255,255,255,0.15);
 color: #FF9E2C;
 font-size: 14px;
 font-weight: 500;
 margin-bottom: 25px;
 }

 

 .leadership-hero-main .leadership-hero-title {
 color: #fff;
 font-family: 'Poppins', sans-serif;
 font-weight: 700;
 font-size: 47px;
 line-height: 68px;
 letter-spacing: 0;
 text-align: center;
 margin: 0;
 }

 .leadership-hero-main .leadership-hero-title span {
 color: #f9a12b;
 }

 .leadership-hero-main .leadership-hero-subtitle {
 color: rgba(255,255,255,0.75);
 font-size: 16px;
 margin-top: 22px;
 margin-bottom: 32px;
 }

 .leadership-hero-main .leadership-hero-btns {
 margin-top: 10px;
 }

 .leadership-hero-main .leadership-hero-btn {
 display: inline-block;
 background: #0A3A7C;
 color: #fff;
 padding: 14px 28px;
 border-radius: 40px;
 font-size: 15px;
 font-weight: 600;
 text-decoration: none;
 transition: 0.3s ease;
 }

 .leadership-hero-main .leadership-hero-btn:hover {
 background: #0847aa;
 color: #fff;
 text-decoration: none;
 }

 .leadership-hero-main .leadership-hero-btn i {
 margin-left: 6px;
 font-size: 13px;
 }

 .leadership-hero-main .leadership-hero-mobile-img {
 display: none;
 }

/* Mobile */

@media (max-width: 767px) {

 .leadership-hero-main .leadership-hero-title {
 font-size: 20px;
 line-height: 1.3;
 }

 .leadership-hero-main .leadership-hero-subtitle {
 font-size: 14px;
 line-height: 1.6;
 padding: 0 10px;
 }

 .leadership-hero-main .leadership-hero-btn {
 padding: 12px 24px;
 font-size: 14px;
 }

 .leadership-hero-main .leadership-hero-badge {
 font-size: 13px;
 padding: 7px 16px;
 }

 .leadership-hero-main .leadership-hero-mobile-img {
 display: none;
 max-width: 220px;
 margin: 20px auto;
 }
}

.cost-top-title {
 font-family: 'Poppins', sans-serif;
 font-weight: 600;
 font-size: 16px;
 line-height: 100%;
 letter-spacing: 0;
 vertical-align: middle;
 text-transform: capitalize;
 color: #FF9E2C;
 margin-bottom: 12px;
 text-align: left;
}

.cost-main-title {
 color: #143b7d;
 font-family: 'Poppins', sans-serif;
 font-weight: 600;
 font-size: 40px;
 line-height: 58px;
 text-transform: capitalize;
 margin: 0;
 text-align: center;
 
}

.commandments-heading {
 display: flex;
 justify-content: center;
}

 .commandments-heading .col-sm-5 {
 float: none;
 }

.cost-main-title {
 text-align: center;
}

 .cost-main-title span {
 color: #FF9E2C;
 display: inline; /* block hata diya */
 margin-top: 0;
 }

.cost-description {
 text-align: inherit;
 text-wrap: balance;
 font-family: 'Geist', sans-serif;
 font-size: 16px;
 font-weight: 400;
 line-height: 25.9px;
 letter-spacing: -0.19px;
 color: #364969;
 text-align: left;
}
.dis{
 display: flex;
 justify-content: flex-end;
 flex-direction: column;
}

@media (max-width: 767px) {
 .commandments-heading {
 display: block !important;
 }

 .commandments-heading .col-sm-5,
 .commandments-heading .col-sm-7 {
 width: 100%;
 }

 .cost-main-title {
 text-align: center;
 }
 .cost-main-title {
 white-space: nowrap;
 }

 .cost-description {
 text-align: left;
 margin-top: 15px;
 }
}

.principle-card {
 background: #fff;
 border: 1px solid #e7e8f2;
 border-radius: 14px;
 padding: 34px 34px;
 transition: 0.3s ease;
 margin-top: 30px;
}

 .principle-card:hover {
 transform: translateY(-4px);
 }

 .principle-card .principle-image img {
 width: 42px;
 height: 42px;
 object-fit: contain;
 }

 .principle-card .principle-title {
 font-family: 'Poppins', sans-serif;
 font-weight: 500;
 font-size: 20px;
 line-height: 30px;
 letter-spacing: -0.5px;
 vertical-align: middle;
 color: #1d1952;
 margin-top: 28px;
 margin-bottom: 18px;
 text-align: left;
 }

 .principle-card .principle-text {
 font-family: 'Inter', sans-serif;
 font-weight: 400;
 font-size: 16px;
 line-height: 25.92px;
 letter-spacing: -0.19px;
 vertical-align: middle;
 color: #5d6785;
 margin: 0;
 text-align: left
 }

/* Tablet */

@media (max-width: 991px) {

 .cost-main-title {
 font-size: 42px;
 line-height: 54px;
 }

 .cost-description {
 max-width: 100%;
 margin-top: 25px;
 
 }

 .principle-card {
 padding: 24px 18px;
 min-height: 270px;
 }

 .principle-title {
 font-size: 20px;
 line-height: 28px;
 }
}

/* Mobile */

@media (max-width: 767px) {

 .cost-top-title {
 text-align: center;
 font-size: 12px;
 margin-bottom: 10px;
 }

 .cost-main-title {
 font-size: 20px;
 line-height: 30px;
 text-align: center;
 }

 .cost-description {
 font-size: 13px;
 line-height: 24px;
 text-align: center;
 margin-top: 18px;
 
 margin-bottom: 10px;
 }

 .principle-card {
 padding: 18px 16px;
 margin-top: 18px;
 min-height: auto;
 border-radius: 12px;
 }

 .principle-icon img {
 width: 28px;
 height: 28px;
 }

 .principle-title {
 font-size: 17px;
 line-height: 24px;
 margin-top: 16px;
 margin-bottom: 10px;
 }

 .principle-text {
 font-size: 12px;
 line-height: 22px;
 
 }
}

/* Industries Section*/

.industries-sec {
 padding: 70px 0;
 background: #FEFFFF;
}

 .industries-sec .industries-heading {
 margin-bottom: 45px;
 }

 .industries-sec .industries-heading h2 {
 font-family: 'Poppins', sans-serif;
 font-weight: 600;
 font-style: normal;
 font-size: 40px;
 line-height: 58px;
 letter-spacing: 0;
 text-align: center;
 color: #1f5aa6;
 margin: 0;
 }

 .industries-sec .industries-heading h2 span {
 color: #f59a23;
 }

 .industries-sec .industries-row {
 display: flex;
 flex-wrap: wrap;
 justify-content: center;
 }

 .industries-sec .industries-row > div {
 padding-left: 10px;
 padding-right: 10px;
 margin-bottom: 20px;
 }

 .industries-sec .industry-card {
 border-radius: 14px;
 text-align: center;
 padding: 20px 20px;
 min-height: 140px;
 border: 1px solid #e6e6e6;
 transition: all 0.3s ease;
 }

 .industries-sec .industry-card img {
 width: 38px;
 height: 38px;
 margin: 0 auto 16px;
 display: block;
 }

 .industries-sec .industry-card h4 {
 font-size: 18px;
 font-weight: 500;
 color: #000000;
 font-size: medium;
 line-height: 1.5;
 margin: 0;
 font-family: poppins;
 }

 /* Card Backgrounds */

 .industries-sec .integrity-card {
 background: #DFE8F6;
 }

 .industries-sec .excellence-card {
 background: #EFEEEE;
 }

 .industries-sec .social-card {
 background: #DEEDEA;
 }

 .industries-sec .freedom-card {
 background: #F2E5D8;
 }

 .industries-sec .sustainability-card {
 background: #F5EED5;
 }

 .industries-sec .respect-card {
 background: #EBDDE7;
 }

 /* Hover */

 .industries-sec .industry-card:hover {
 transform: translateY(-5px);
 box-shadow: 0 10px 25px rgba(0,0,0,0.08);
 }

/* Mobile Responsive */

@media (max-width: 767px) {

 .industries-sec {
 padding: 10px 0;
 }

 .industries-sec .industries-heading h2 {
 font-size: 20px;
 }

 .industries-sec .industry-card {
 min-height: auto;
 padding: 24px 12px;
 }

 .industries-sec .industry-card h4 {
 font-size: 14px;
 }
}





/*Founders Section*/

.founders-sec {
 padding: 30px 0;
 background: #FCFAF8;
}

 /* 
 HEADINGS
 */

 .founders-sec .founders-heading,
 .founders-sec .leadership-heading {
 margin-bottom: 40px;
 }

 .founders-sec .leadership-heading {
 margin-top: 35px;
 }

 .founders-sec .founders-heading h2,
 .founders-sec .leadership-heading h2 {
 margin: 0;
 font-family: 'Poppins', sans-serif;
 font-weight: 600;
 font-size: 40px;
 line-height: 58px;
 letter-spacing: 0;
 text-align: center;
 color: #0F4F93;
 }

 .founders-sec .founders-heading h2 span,
 .founders-sec .leadership-heading h2 span {
 color: #FF9E2C;
 }


 /* 
 FOUNDERS ROW
 */

 .founders-sec .founders-row {
 margin-bottom: 20px;
 }


 /* 
 FOUNDER CARD
 */

 .founders-sec .founder-card {
 background: #ffffff;
 border-radius: 18px;
 padding: 24px;
 display: flex;
 flex-direction: row;
 gap: 24px;
 align-items: flex-start;
 min-height: 500px;
 width: 100%;
 box-shadow: 0 2px 10px rgba(0,0,0,0.03);
 transition: 0.3s ease;
 }

 .founders-sec .founder-card:hover {
 transform: translateY(-5px);
 box-shadow: 0 10px 25px rgba(0,0,0,0.08);
 }


 /* FOUNDER IMAGE */

 .founders-sec .founder-image {
 min-width: 280px;
 }

 .founders-sec .founder-image img {
 width: 100%;
 height: 380px;
 object-fit: cover;
 border-radius: 14px;
 }


 /* NAME + DESIGNATION */

 .founders-sec .founder-image h4 {
 font-family: 'Poppins', sans-serif;
 font-size: 20px;
 font-weight: 500;
 font:medium;
 color: #1A0B54;
 margin: 10px 0 5px;
 }

 .founders-sec .founder-designation {
 display: inline-block;
 font-size: 12px;
 font-weight: 600;
 letter-spacing: 3px;
 color: #F4A100;
 
 }

/* 
 FOUNDERS SECTION
 */

.founders-sec {
 background: #FCFAF8;
 padding: 70px 0;
}

 /* Headings */

 .founders-sec .founders-heading,
 .founders-sec .leadership-heading {
 margin-bottom: 20px;
 }

 .founders-sec .leadership-heading {
 margin-top: 20px;
 }

 .founders-sec .founders-heading h2,
 .founders-sec .leadership-heading h2 {
 margin: 0;
 font-family: 'Poppins', sans-serif;
 font-weight: 600;
 font-size: 40px;
 line-height: 58px;
 text-align: center;
 color: #0F4F93;
 }

 .founders-sec .founders-heading h2 span,
 .founders-sec .leadership-heading h2 span {
 color: #FF9E2C;
 }

 /* Founder Cards */

 .founders-sec .founders-row {
 margin-left: -15px;
 margin-right: -15px;
 }

 .founders-sec .founders-row > div {
 margin-bottom: 30px;
 }

 .founders-sec .founder-card {
 background: #fff;
 border-radius: 18px;
 padding: 25px;
 min-height: 500px;
 display: flex;
 gap: 25px;
 box-shadow: 0 2px 10px rgba(0,0,0,.03);
 }

 .founders-sec .founder-image-box {
 width: 265px;
 flex-shrink: 0;
 }

 .founders-sec .founder-image-box img {
 width: 100%;
 height: 380px;
 object-fit: cover;
 border-radius: 14px;
 }

 .founders-sec .founder-info {
 margin-top: 25px;
 
 }

 .founders-sec .founder-info h4 {
 
 font-family: 'Poppins', sans-serif;
 font-size: 20px;
 font-weight: 600;
 text-align: left;
 color: #1A0B54;
 }

 .founders-sec .founder-info span {
 display: block;
 font-family: 'Poppins', sans-serif;
 font-size: 14px;
 font-weight: 600;
 letter-spacing: 3px;
 color: #F4A100;
 text-align: left;
 
 }

 .founders-sec .founder-content {
 flex: 1;
 }

 .founders-sec .founder-content p {
 margin: 0;
 font-family: 'Poppins', sans-serif;
 font-size: 18px;
 line-height: 34px;
 color: #1A0B54;
 }

 /* Leadership */
/*.leadership-row {
 display: flex;
 justify-content: center;
 flex-wrap: wrap;
 align-items: center;
}

.leadership-row .col-sm-4 {
 width: 31%;
 
}

@media (max-width: 767px) {
 .leadership-row {
 display: flex;
 flex-wrap: wrap;
 justify-content: center;
 gap: 15px;
 }

 .leadership-row .col-sm-4 {
 width: calc(50% - 8px) !important;
 padding: 0;
 }

 .leadership-row .col-sm-4:last-child {
 width: 50% !important;
 }
}*/
.leadership-row {
 display: flex;
 justify-content: center;
 flex-wrap: wrap;
 align-items: center;
}

 .leadership-row .col-sm-4 {
 width: 31%;
 }

@media (max-width: 767px) {
 .leadership-row {
 gap: 15px;
 }

 .leadership-row .col-sm-4 {
 width: 70% !important; /* card width on mobile */
 padding: 0;
 }

 .leadership-row .col-sm-4:last-child {
 width: 70% !important;
 }
}

 .founders-sec .leadership-row {
 max-width: 1000px;
 margin: 0 auto;
 }

 .founders-sec .leader-card {
 background: #fff;
 border: 1px solid #ECECEC;
 border-radius: 15px;
 padding: 8px;
 overflow: hidden;
 transition: .3s;
/* margin-bottom: 30px;*/
 }

 .founders-sec .leader-card:hover {
 transform: translateY(-5px);
 }

 .founders-sec .leader-image {
 border-radius: 14px;
 overflow: hidden;
 background: #F3F3F3;
 }

 .founders-sec .leader-image img {
 width: 100%;
 height: 250px;
 object-fit: cover;
 }

 .founders-sec .leader-content {
 padding: 15px 8px 10px;
 }

 .founders-sec .leader-content h4 {
 margin: 0 0 8px;
 font-family: 'Poppins', sans-serif;
 font-size: 16px;
 font-weight: 600;
 color: #1A0B54;
 }

 .founders-sec .leader-content span {
 display: block;
 font-family: 'Poppins', sans-serif;
 font-size: 9px;
 font-weight: 600;
 letter-spacing: 3px;
 text-transform: uppercase;
 color: #F4A100;
 }

/* Responsive */

@media (max-width:991px) {

 .founders-sec .founder-card {
 display: block;
 min-height: auto;
 }

 .founders-sec .founder-image-box {
 width: 100%;
 }

 .founders-sec .founder-image-box img {
 height: auto;
 }

 .founders-sec .founder-info {
 padding-left: 0;
 margin-bottom: 25px;
 }
}

@media (max-width:767px) {

 .founders-sec {
 padding: 50px 0;
 }

 .founders-sec .founders-heading,
 .founders-sec .leadership-heading {
 margin-bottom: 40px;
 }

 .founders-sec .leadership-heading {
 margin-top: 40px;
 }

 .founders-sec .founders-heading h2,
 .founders-sec .leadership-heading h2 {
 font-size: 30px;
 line-height: 42px;
 text-align: left;
 }

 .founders-sec .founder-content p {
 font-size: 16px;
 line-height: 30px;
 
 }

 .founders-sec .leader-image img {
 height: 220px;
 }
}
 /* 
 CONTENT
 */

 .founders-sec .founder-content {
 flex: 1;
 }

 .founders-sec .founder-content p {
 font-family: 'Poppins', sans-serif;
 font-size: 20px;
 line-height: 34px;
 color: #1A0B54;
 margin: 0;
 text-align: left;
 }


 /* 
 LEADERSHIP ROW
 */

 .founders-sec .leadership-row {
 margin-top: 10px;
 }
.leadership-row > div {
 padding-left: 8px;
 padding-right: 8px;
}


 /* 
 LEADER CARD
 */

 .founders-sec .leader-card {
 background: #fff;
 border-radius: 14px;
 padding: 14px;
 border: 1px solid #ececec;
 width: 280px;
 transition: all 0.3s ease;
 }

 .founders-sec .leader-card:hover {
 transform: translateY(-5px);
 box-shadow: 0 10px 25px rgba(0,0,0,0.08);
 }


 /* 
 LEADER IMAGE
 */

 .founders-sec .leader-image img {
 width: 100%;
 max-width: 352px;
 object-fit: cover;
 border-radius: 10px;
 background: #d9d9d9;
 display: block;
 margin: 0 auto;
 }


 /* 
 LEADER CONTENT
*/

 .founders-sec .leader-content {
 padding-top: 15px;
 }

 .founders-sec .leader-content span {
 display: block;
 font-size: 14px;
 font-weight: 600;
 letter-spacing: 2px;
 color: #FF9E2C;
/* margin-bottom: 8px;*/
 font-family: 'Poppins', sans-serif;
 }

 .founders-sec .leader-content h4 {
/* margin: 0;*/
 font-size: 20px;
 font-weight: 500;
 color: #1A0B54;
 font-family: 'Poppins', sans-serif;
 }


/* 
 TABLET RESPONSIVE
 */

@media (max-width: 991px) {

 .founders-sec {
 padding: 55px 0;
 }

 .founders-sec .founders-heading h2,
 .founders-sec .leadership-heading h2 {
 font-size: 34px;
 line-height: 48px;
 }

 .founders-sec .founder-card {
 flex-direction: column;
 min-height: auto;
 padding: 18px;
 gap: 18px;
 }

 .founders-sec .founder-image {
 width: 100%;
 min-width: 100%;
 }

 .founders-sec .founder-image img {
 width: 100%;
 height: 320px;
 }

 .founders-sec .founder-content p {
 font-size: 14px;
 line-height: 28px;
 }

 .founders-sec .founder-image h4 {
 font-size: 22px;
 }

 .founders-sec .leader-card {
 width: 100%;
 }

 .founders-sec .leader-image img {
 width: 100%;
 max-width: 100%;
 height: auto;
 }

 .founders-sec .leader-content h4 {
 font-size: 18px;
 }
}


/*
 MOBILE RESPONSIVE
*/

@media (max-width: 767px) {

 .founders-sec {
 padding: 40px 0;
 }

 .founders-sec .founders-heading,
 .founders-sec .leadership-heading {
 margin-bottom: 25px;
 }

 .founders-sec .founders-heading h2,
 .founders-sec .leadership-heading h2 {
 font-size: 20px;
 line-height: 34px;
 text-align: center;
 }

 .founders-sec .founders-row {
 margin-bottom: 30px;
 }

 .founders-sec .founder-card {
 flex-direction: column;
 padding: 16px;
 gap: 14px;
 border-radius: 14px;
 min-height: auto;
 margin-top: 15px;
 }

 .founders-sec .founder-image {
 width: 100%;
 min-width: 100%;
 }

 .founders-sec .founder-image img {
 width: 100%;
 height: 260px;
 border-radius: 12px;
 }

 .founders-sec .founder-designation {
 font-size: 10px;
 letter-spacing: 2px;
 margin-top: 12px;
 }

 .founders-sec .founder-image h4 {
 font-size: 20px;
 line-height: 28px;
 }

 .founders-sec .founder-content p {
 font-size: 14px;
 line-height: 24px;
 margin-top: 10px;
 }

 .founders-sec .leader-card {
 width: 100%;
 padding: 12px;
 border-radius: 12px;
 margin-bottom: 20px;
 text-align: center;
 }

 .founders-sec .leader-image img {
 width: 100%;
 max-width: 280px;
 height: auto;
 border-radius: 10px;
 }

 .founders-sec .leader-content {
 padding-top: 15px;
 }

 .founders-sec .leader-content span {
 font-size: 10px;
 letter-spacing: 1px;
 margin-bottom: 6px;
 }

 .founders-sec .leader-content h4 {
 font-size: 18px;
 line-height: 26px;
 margin-bottom: 8px;
 }

 .founders-sec .leader-content p {
 font-size: 14px;
 line-height: 22px;
 }
}
/* 
 HOW WE WORK SECTION
 */

.Howwework-sec {
 padding: 50px 0;
 background: #FFFFFF;
}

 /* 
 HEADING
 */

 .Howwework-sec .Howwework-heading {
 margin-bottom: 50px;
 }

 .Howwework-sec .Howwework-heading h2 {
 font-family: 'Poppins', sans-serif;
 font-size: 40px;
 font-weight: 600;
 line-height: 58px;
 color: #0F4F93;
/* margin-bottom: 15px;*/
 }

 .Howwework-sec .Howwework-heading h2 span {
 font-family: 'Poppins', sans-serif;
 font-size: 40px;
 font-weight: 600;
 line-height: 58px;
 color: #FF9E2C;
 }

 .Howwework-sec .Howwework-heading p {
 font-family: 'Poppins', sans-serif;
 font-size: 16px;
 line-height: 25px;
 color: #364969;
 max-width: 620px;
 margin: 0 auto;
 }

 
 .Howwework-sec .Howwework-row {
 display: flex;
 flex-wrap: wrap;
 justify-content: center;
 gap: 65px;
 position: relative;
 }

@media (max-width: 768px) {
 .Howwework-sec .Howwework-row{
 gap: 10px
 }
}


@media (max-width: 767px) {

 .Howwework-sec .Howwework-row {
 display: flex;
 flex-wrap: wrap;
 gap: 0 !important;
 margin-left: -5px;
 margin-right: -5px;
 }

 .Howwework-sec .Howwework-row > div {
 width: 50%;
 padding: 0 5px;
 }

 .Howwework-sec .Howwework-card {
 margin-bottom: 10px;
 height: auto;
 }
}

.hero-title-labour {
 display: flex;
 align-items: center;
 justify-content: center;
 gap: 12px;
}

.hr-samvaad-img {
 height: 50px;
 width: auto;
 display: block;
}

/* Mobile */
@media (max-width: 576px) {
 .hero-title-labour {
 flex-direction: column;
 gap: 8px;
 text-align: center;
 }

 .hr-samvaad-img {
 height: 35px;
 }
}

/* Tablet */
@media (max-width: 768px) {
 .hr-samvaad-img {
 height: 40px;
 }
}

/* Mobile */
@media (max-width: 576px) {
 .hr-samvaad-img {
 height: 30px;
 }
}
 /* 
 CARD
 */

.Howwework-sec .Howwework-card {
 border-radius: 14px;
 padding: 18px 16px;
 height: 182px;
 transition: 0.3s ease;
 margin-bottom: 30px;
 box-shadow: 0 2px 10px rgba(0, 0, 0, 0.2);
 overflow: hidden;
}

 .Howwework-sec .Howwework-card:hover {
 transform: translateY(-5px);
 }



 /* Last card line remove */
 .Howwework-row .col-lg-2:last-child .Howwework-card::after {
 display: none;
 }



 .Howwework-sec .Howwework-top {
 display: flex;
 flex-direction: column;
 align-items: center;
 gap: 10px;
 margin-bottom: 12px;
 text-align: center;
 }

 .Howwework-sec .Howwework-icon {
 margin-bottom: 0;
 }

 .Howwework-sec .Howwework-icon img {
 width: 26px;
 height: 26px;
 object-fit: contain;
 }

 .Howwework-sec .Howwework-card h4 {
 margin: 0;
 color: #1A0B54;
 font-size: 20px;
 font-family: 'Poppins', sans-serif;
 line-height: 30px;
 text-align: center;
 }

 /* Paragraph */
 .Howwework-sec .Howwework-card p {
 font-family: 'Poppins', sans-serif;
 font-size: 13px;
 line-height: 21px;
 color: #000000;
 margin: 0;
 text-align: center;
 }

 /* 
 LAPTOP
 */
 @media (max-width: 1199px) {
 .Howwework-sec .Howwework-heading h2, .Howwework-sec .Howwework-heading h2 span {
 font-size: 34px;
 line-height: 48px;
 }

 .Howwework-sec .Howwework-card {
 height: 190px;
 padding: 16px 14px;
 }

 .Howwework-sec .Howwework-card h4 {
 font-size: 15px;
 }

 .Howwework-sec .Howwework-card p {
 font-size: 12px;
 line-height: 20px;
 }
 }

 /* 
 TABLET
 */

 @media (max-width: 991px) {

 .Howwework-sec {
 padding: 60px 0;
 }

 .Howwework-sec .Howwework-heading {
 margin-bottom: 40px;
 }

 .Howwework-sec .Howwework-heading h2,
 .Howwework-sec .Howwework-heading h2 span {
 font-size: 30px;
 line-height: 42px;
 }

 .Howwework-sec .Howwework-heading p {
 font-size: 15px;
 line-height: 24px;
 }

 .Howwework-sec .Howwework-card {
 height: auto;
 min-height: 182px;
 }
 }

 .request-demo-btn {
 display: inline-flex;
 align-items: center;
 justify-content: center;
 gap: 10px;
 padding: 8px 16px;
 font: normal 400 16px/24px 'Poppins', sans-serif;
 background: #0A3A7C;
 color: #fff !important;
 border-radius: 50px;
 border: none;
 transition: all 0.3s ease;
 text-decoration: none;
 }

 .request-demo-btn img {
 width: 28px;
 height: 28px;
 object-fit: contain;
 }

 .request-demo-btn:hover {
 background: #082d61;
 color: #fff !important;
 }

 /* Responsive */
 @media (max-width: 767px) {
 .request-demo-btn {
 padding: 10px 24px;
 font-size: 14px;
 line-height: 20px;
 gap: 8px;
 width: 100%;
 max-width: 260px;
 }

 .request-demo-btn img {
 width: 16px;
 height: 16px;
 }
 }

 /* =========================
 MOBILE
========================= */

 @media (max-width: 767px) {

 .Howwework-sec {
 padding: 10px 0;
 }

 .Howwework-sec .Howwework-heading {
 margin-bottom: 30px;
 }

 .Howwework-sec .Howwework-heading h2,
 .Howwework-sec .Howwework-heading h2 span {
 font-size: 20px;
 line-height: 36px;
 }

 .Howwework-sec .Howwework-heading p {
 font-size: 14px;
 line-height: 22px;
 padding: 0 15px;
 }

 .Howwework-sec .Howwework-card {
 height: auto;
 min-height: auto;
 text-align: center;
 padding: 20px 16px;
 }

 .Howwework-sec .Howwework-icon {
 text-align: center;
 margin-bottom: 10px;
 }

 .Howwework-sec .Howwework-icon img {
 width: 24px;
 height: 24px;
 }

 .Howwework-sec .Howwework-card h4 {
 font-size: 15px;
 line-height: 22px;
 margin-bottom: 8px;
 }

 .Howwework-sec .Howwework-card p {
 font-size: 13px;
 line-height: 20px;
 }
 }





 .Howwework-row {
 display: flex;
 flex-wrap: wrap;
 justify-content: center;
 gap: 50px;
 position: relative;
 }

 .Howwework-row > div {
 position: relative;
 }

 /* Curve line between cards */
 .Howwework-row > div:not(:last-child)::after {
 content: "";
 position: absolute;
 top: 42%;
 right: -75px;
 width: 90px;
 height: 55px;
 border-top: 3px dashed #838BB5;
 border-radius: 50%;
 transform: translateY(-50%);
 }

 /* Hide line on tablet/mobile */
 @media (max-width: 991px) {
 .Howwework-row {
 gap: 10px;
 }

 .Howwework-row > div::after {
 display: none;
 }
 }


 .team-row {
 row-gap: 30px;
 justify-content: center;
 }

 /* CARD */
 .team-card {
 width: 100%;
 max-width: 400px;
 height: 412px;
 padding: 24px;
 border-radius: 20px;
 background: #fff;
 display: flex;
 flex-direction: column;
 gap: 10px;
 margin: auto;
 transition: 0.3s ease;
 }

 .team-card:hover {
 transform: translateY(-5px);
 }

 /* IMAGE */
 .team-image {
 width: 100%;
 height: 280px;
 border-radius: 14px;
 overflow: hidden;
 }

 .team-image img {
 width: 100%;
 height: 100%;
 object-fit: cover;
 border-radius: 14px;
 display: block;
 }

 /* CONTENT */
 .team-content {
 padding-top: 8px;
 }

 /* NAME */
 .team-content h4 {
 font-family: 'Poppins', sans-serif;
 font-weight: 500;
 font-size: 20px;
 line-height: 30px;
 letter-spacing: -0.5px;
 margin: 0 0 6px;
 color: #111;
 }

 /* DESIGNATION */
 .team-content span {
 display: block;
 font-family: 'Poppins', sans-serif;
 font-weight: 600;
 font-size: 14.4px;
 line-height: 23.9px;
 letter-spacing: 2.4px;
 text-transform: uppercase;
 color: #7A7A7A;
 }

 /* RESPONSIVE */
 @media(max-width:991px) {

 .team-card {
 max-width: 100%;
 height: auto;
 }

 .team-image {
 height: 240px;
 }
 }

 @media(max-width:576px) {

 .team-row {
 row-gap: 20px;
 }

 .team-card {
 padding: 18px;
 border-radius: 16px;
 }

 .team-image {
 height: 220px;
 }

 .team-content h4 {
 font-size: 18px;
 line-height: 28px;
 }

 .team-content span {
 font-size: 13px;
 line-height: 22px;
 letter-spacing: 2px;
 }
 }


.cta-hrss {
 margin-top: 70px;
}

.coming-soon-btn {
 width: 366.76px;
 max-width: 100%;
 height: auto;
 display: block;
 margin: 0 auto;
}



.Event-section {
 padding: 60px 0;
/* background: #f5f5f5;*/
}

.event-heading {
 font-size: 32px;
 font-weight: 600;
 margin-bottom: 30px;
 color: #333;
}

.event-card {
 border-radius: 12px;
 overflow: hidden;
 height: 100%;
 margin-bottom: 0;
}

 .event-card img {
 width: 100%;
 height: 100%;
 display: block;
 border-radius: 12px;
 object-fit: cover;
 }

 /* Style 2 */
 .event-card.style-2 {
 position: relative;
 padding: 0;
 margin: 0;
 border: 0;
 min-height: auto;
 background-color: transparent;
 }

 .event-card.style-2 img.image {
 position: relative;
 }

 .event-card.style-2 .event-title {
 position: absolute;
 color: #fff;
 padding: 16px 16px 16px 36px;
 z-index: 1;
 bottom: 0;
 left: 0;
 }

/* Laptop */
@media (max-width: 1199px) {
 .event-card.style-2 .event-title {
 padding: 15px 15px 15px 25px;
 }
}

/* Tablet */
@media (max-width: 991px) {
 .event-card {
 margin-bottom: 20px;
 }

 .event-card.style-2 .event-title {
 padding: 12px 12px 12px 20px;
 }
}

/* Mobile */
@media (max-width: 767px) {
 .event-card {
 margin-bottom: 16px; /* gap between cards */
 }

 .event-card img {
 min-height: 220px;
 }

 .event-card.style-2 .event-title {
 padding: 10px 10px 10px 16px;
 font-size: 16px;
 line-height: 22px;
 }
}

/* Small Mobile */
@media (max-width: 480px) {
 .event-card {
 margin-bottom: 12px;
 }

 .event-card img {
 min-height: 180px;
 margin-top: 20px
 }

 .event-card.style-2 .event-title {
 padding: 8px 8px 8px 12px;
 font-size: 14px;
 line-height: 20px;
 }
}

#sectiocolor {
 background: #F8F9FA;
}


.event-heading-past {
 font-family: 'Poppins', sans-serif;
 font-weight: 500;
 font-size: 30px;
 line-height: 36px;
 margin-bottom: 30px;
 letter-spacing: 0;
 vertical-align: middle;
 color: #333333;
}

/* Mobile Responsive */
@media (max-width: 767px) {
 .event-heading-past {
 font-size: 22px;
 line-height: 28px;
 margin-bottom: 20px;
 }
}

/* ═══════════════════════════════════════════════════════════
   PRICING HERO CARD — 2026 redesign (Figma node 5277:26051)
   Restyles the existing .hero-price-card; JS hooks unchanged.
   ═══════════════════════════════════════════════════════════ */
.hero-price-card {
  padding: 32px 28px;
  border-radius: 32px;
  box-shadow: 0 6px 14px rgba(11, 31, 58, .09);
}
.hero-price-card::before {
  content: 'Plans from \20B9 65/employee';
  top: -13px;
  padding: 8px 16px;
  border-radius: 50px;
  background: #1e40af;
  color: #fff;
  font-size: 14px;
  font-weight: 500;
  letter-spacing: 0;
  text-transform: none;
}
.hero-price-card h2,
.hero-price-card h3 {
  margin: 4px 0 0;
  font-family: 'Plus Jakarta Sans', sans-serif;
  font-size: 22px;
  font-weight: 700;
  line-height: 1.36;
  color: #343a40;
  text-align: center;
}
.hero-price-card > .sub,
.hero-price-card .sub {
  margin-bottom: 15px;
  font-size: 16px;
  line-height: 1.5;
  color: #343a40;
  opacity: .8;
}

/* billing toggle */
.hero-price-card .billing-toggle {
  gap: 0;
  margin: 5px 0 10px;
  padding: 4px;
  background: #eef1f6;
}
.hero-price-card .billing-opt {
  min-height: 44px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  padding: 10px 12px;
  font-size: 16px;
  font-weight: 500;
  color: #9ba8bc;
}
.hero-price-card .billing-opt.active {
  font-weight: 700;
  color: #343a40;
  box-shadow: 0 2px 4px rgba(0, 0, 0, .1);
}
.hero-price-card .save-pill {
  margin-left: 0;
  padding: 1px 7px;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .04em;
  background: #1e40af;
}
#buildTagline.sub {
  margin-bottom: 15px;
  font-size: 16px !important;
  font-weight: 400 !important;
  opacity: .8;
}

/* plan rows */
.hero-price-card .mini-plans {
  gap: 15px;
  margin-bottom: 15px;
}
.hero-price-card .mini-plan {
  gap: 12px;
  padding: 15px;
  border: 1.5px solid #eef1f6;
  border-radius: 14px;
}
.hero-price-card .mini-plan:hover {
  background: #f7f9fd;
  border-color: #1e40af;
}
.hero-price-card .mini-plan.selected,
.hero-price-card .mini-plan.featured-plan {
  border-color: #1e40af !important;
  background: transparent;
}
.hero-price-card .mini-plan-name {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 16px;
  font-weight: 700;
  color: #343a40;
}
.hero-price-card .mini-plan-desc {
  font-size: 15px;
  color: #6b7a90;
}
.hero-price-card .mini-plan-amt {
  font-size: 16px;
  font-weight: 700;
  color: #1e40af;
}
.hero-price-card .mini-plan-per {
  margin-top: 1px;
  font-size: 15px;
  color: #9ba8bc;
}
.hero-price-card .popular-tag {
  padding: 2px 7px;
  font-size: 9px;
  letter-spacing: .07em;
  background: #1e40af;
}

/* CTAs */
.hero-price-card .hero-price-ctas {
  gap: 15px;
}
.hero-price-card .hero-price-ctas .btn {
  min-height: 52px;
  align-items: center;
  padding: 14px 30px;
  border-radius: 52px;
  font-size: 16px;
  font-weight: 500;
}
.hero-price-card .hero-price-ctas .btn-primary {
  background: #030303;
  border-color: #030303;
  color: #fff;
}
.hero-price-card .hero-price-ctas .btn-outline {
  background: transparent;
  border: 1.5px solid #1e40af;
  color: #343a40;
}

/* trust row */
.hero-price-card .trust-micro {
  gap: 10px;
  margin-top: 15px;
  font-size: 14px;
  color: #9ba8bc;
}
.hero-price-card .trust-micro span {
  gap: 4px;
}

@media (max-width: 767px) {
  .hero-price-card .mini-plan-name { font-size: 15px; }
  .hero-price-card .trust-micro { font-size: 12px; }
}

/* ═══════════════════════════════════════════════════════════
   PRICING HERO — LEFT COLUMN 2026 redesign (Figma node 5277:25992)
   Restyles existing hero markup; no structural changes.
   ═══════════════════════════════════════════════════════════ */
.hero .hero-layout { align-items: start; }

.hero .glossary-badge {
  align-self: flex-start;
  gap: 7px;
  padding: 10px 16px;
  margin-bottom: 15px;
  border: 2px solid transparent;
  border-radius: 100px;
  background: linear-gradient(#fff, #fff) padding-box,
    linear-gradient(90deg, #ff6bc9, #7c58ff) border-box;
}
.hero .glossary-badge img { width: 16px; height: 16px; }
.hero .glossary-badge span { font-size: 18px; font-weight: 500; line-height: 24px; }

.hero .pricing-hero-title {
  font-size: clamp(38px, 4.5vw, 62px);
  font-weight: 700;
  line-height: 1.13;
  letter-spacing: -.02em;
  color: #343a40;
  margin-bottom: 0;
  padding-bottom: 24px;
}
.hero .pricing-hero-title span,
.hero .pricing-hero-title em { display: block; }
.hero .pricing-hero-title em { color: #1e40af; font-style: normal; }
.hero .pricing-hero-title span em { display: inline; }

.hero .hero-sub {
  max-width: none;
  margin: 0;
  font-size: 18px;
  font-weight: 600;
  line-height: 1.35;
  color: #343a40;
}

.hero .hero-checks {
  gap: 15px;
  margin-bottom: 24px;
}
.hero .hero-check {
  align-items: flex-start;
  gap: 10px;
  font-family: 'Inter', 'Plus Jakarta Sans', sans-serif;
  font-size: 16px;
  font-weight: 500;
  line-height: 1.5;
  color: #343a40;
}
.hero .hero-check .check-icon {
  width: 18px;
  height: 24px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: none;
  font-size: 0;
  color: inherit;
}
.hero .hero-check .check-icon img { width: 18px; height: 20px; max-width: none; }

.hero .hero-ctas {
  gap: 15px;
  margin-bottom: 24px;
}
.hero .hero-ctas .pricing-hero-btn {
  min-height: 58px;
  align-items: center;
  padding: 14px 30px;
  border-radius: 52px;
  font-size: 16px;
  font-weight: 500;
}
.hero .hero-ctas .btn-primary.pricing-hero-btn {
  background: #1e40af;
  border-color: #1e40af;
  box-shadow: 0 10px 22px rgba(30, 64, 175, .18);
  color: #fff;
}
.hero .hero-ctas .pricing-hero-btn-outline {
  background: #fff;
  border: 1.5px solid #1e40af;
  color: #1e40af;
}
.hero .hero-ctas .pricing-hero-btn img { width: 24px; height: 24px; max-width: none; }

/* stats strip — lavender glass panel with dividers */
.hero .hero-stats {
  gap: 24px;
  margin-top: 4px;
  padding: 24px;
  border: 1px solid rgba(223, 202, 247, .6);
  border-radius: 24px;
  background: rgba(223, 202, 247, .31);
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);
}
.hero .hero-stats > div {
  flex: 1;
  min-width: 160px;
}
.hero .hero-stats > div:not(:last-child) {
  padding-right: 24px;
  border-right: 1px solid rgba(52, 58, 64, .2);
}
.hero .hero-stat-val {
  display: flex;
  align-items: center;
  gap: 5px;
  font-size: 1.94rem;
  font-weight: 700;
  line-height: 1.29;
  color: #343a40;
}
.hero .hero-stat-val img { width: 24px; height: 24px; max-width: none; }
.hero .hero-stat-label {
  margin-top: 2px;
  font-size: 16px;
  color: #343a40;
}

@media (max-width: 991px) {
  .hero .hero-stats > div:not(:last-child) { border-right: 0; padding-right: 0; }
}

@media (max-width: 700px) {
  .hero .glossary-badge { padding: 8px 12px; margin-bottom: 14px; }
  .hero .glossary-badge img { display: block; width: 16px; height: 16px; }
  .hero .glossary-badge span { font-size: 12px !important; line-height: 18px; }
  .hero .pricing-hero-title { font-size: clamp(30px, 8.6vw, 36px); line-height: 1.14; margin-bottom: 24px; }
  .hero .pricing-hero-title span,
  .hero .pricing-hero-title > em { max-width: none; margin: 0; }
  .hero .pricing-hero-title > em { margin-top: 0; }
  .hero .hero-checks { gap: 12px; }
  .hero .hero-check { font-size: 15px; line-height: 1.5; }
  .hero .hero-stats { display: grid; grid-template-columns: 1fr; gap: 18px; }
  .hero .hero-stats > div:not(:last-child) { border-bottom: 1px solid rgba(52, 58, 64, .2); padding-bottom: 18px; }
}

/* ═══════════════════════════════════════════════════════════
   PRICING PLANS — 2026 redesign (Figma node 5277:27735)
   Preserves existing plan data, controls, links, and billing hooks.
   ═══════════════════════════════════════════════════════════ */
.figma-pricing-section {
  padding: 100px 0;
  background: #fff;
}
.figma-pricing-section .container { max-width: 1380px; }
.figma-pricing-heading { display: flex; flex-direction: column; align-items: center; gap: 15px; }
.figma-pricing-heading .glossary-badge {
  gap: 7px;
  margin: 0;
  padding: 10px 16px;
  border: 2px solid transparent;
  border-radius: 100px;
  background: linear-gradient(#fff, #fff) padding-box,
    linear-gradient(90deg, #ff6bc9, #7c58ff) border-box;
}
.figma-pricing-heading .glossary-badge img { width: 16px; height: 16px; }
.figma-pricing-heading .glossary-badge span {
  color: #000;
  font-family: 'Plus Jakarta Sans', sans-serif;
  font-size: 18px;
  font-weight: 500;
  line-height: 24px;
}
.figma-pricing-heading .section-title {
  margin: 0;
  color: #343a40 !important;
  font-family: 'Plus Jakarta Sans', sans-serif;
  font-size: 46px !important;
  font-weight: 700;
  letter-spacing: -.02em;
  line-height: 1.2;
}
.figma-pricing-heading .section-title span { color: #1e40af; }
.figma-pricing-heading .section-sub {
  margin: 0;
  color: #656971;
  font-family: 'Plus Jakarta Sans', sans-serif;
  font-size: 18px;
  font-weight: 500;
  line-height: 24px;
}

.figma-pricing-section .pricing-billing-wrap {
  display: flex;
  justify-content: center;
  margin: 30px 0 0;
}
.figma-pricing-section .pricing-billing-toggle {
  display: inline-flex;
  padding: 4px;
  border-radius: 99px;
  background: #eef1f6;
}
.figma-pricing-section .billing-opt {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  width: 200px;
  min-height: 44px;
  padding: 10px 12px;
  border-radius: 99px;
  color: #9ba8bc;
  font-family: 'Plus Jakarta Sans', sans-serif;
  font-size: 16px;
  font-weight: 500;
  line-height: 20px;
}
.figma-pricing-section .billing-opt.active {
  color: #343a40;
  font-weight: 700;
  background: #fff;
  box-shadow: 0 2px 4px rgba(0, 0, 0, .1);
}
.figma-pricing-section .save-pill {
  margin: 0;
  padding: 1px 7px;
  border-radius: 99px;
  background: #1e40af;
  color: #fff;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .48px;
  line-height: 20px;
}

.figma-pricing-section .plans-grid {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 24px;
  max-width: 1320px;
  margin: 24px auto 0;
}
.figma-pricing-section .plan-card {
  display: flex;
  flex-direction: column;
  min-width: 0;
  min-height: 780px;
  padding: 31px;
  border: 1px solid #e1e6f4;
  border-radius: 24px;
  box-shadow: none;
  background: #fff;
}
.figma-pricing-section .plan-card:hover { transform: none; box-shadow: none; }
.figma-pricing-section .plan-card.popular {
  border-color: #60a5fa;
  box-shadow: 0 0 15.3px rgba(24, 72, 212, .1);
}
.figma-pricing-section .plan-card.popular::before { content: none; }
.figma-pricing-section .plan-tier {
  display: inline-flex;
  align-items: center;
  align-self: flex-start;
  gap: 6px;
  margin: 0 0 10px;
  padding: 4px 12px 4px 10px;
  border-radius: 16px;
  background: #fffaeb;
  color: #b54708 !important;
  font-family: Inter, sans-serif;
  font-size: 14px;
  font-weight: 500;
  letter-spacing: 0;
  line-height: 20px;
  text-transform: uppercase;
}
.figma-pricing-section .plan-tier::before {
  width: 8px;
  height: 8px;
  content: '';
  background: url('/images/figma-pricing-section/pulse-dot.svg') center / 8px 8px no-repeat;
}
.figma-pricing-section .plan-card--rhythm .plan-tier { color: #1e40af !important; }
.figma-pricing-section .plan-card--momentum .plan-tier { background: #fef3f2; color: #b42318 !important; }
.figma-pricing-section .plan-card--momentum .plan-tier::before {
  background-image: url('/images/figma-pricing-section/momentum-dot.svg');
}
.figma-pricing-section .plan-name {
  margin: 0;
  padding-bottom: 10px;
  color: #090909;
  font-family: 'Plus Jakarta Sans', sans-serif;
  font-size: 22px;
  font-weight: 600;
  line-height: 30px;
}
.figma-pricing-section .plan-name::after {
  display: block;
  width: 50px;
  height: 4px;
  margin-top: 6px;
  content: '';
  background: url('/images/figma-pricing-section/section-divider.svg') left center / 50px 4px no-repeat;
}
.figma-pricing-section .plan-tagline {
  min-height: 72px;
  margin: 0 0 15px;
  color: #343a40;
  font-family: Inter, sans-serif;
  font-size: 16px;
  font-weight: 400;
  line-height: 24px;
}
.figma-pricing-section .plan-price-block {
  display: flex;
  flex-direction: column;
  gap: 10px;
  margin: 0 0 15px;
  padding: 0 0 15px;
  border-bottom: 1px solid #dbdbf0;
}
.figma-pricing-section .plan-price-row { gap: 0; }
.figma-pricing-section .plan-amt {
  color: #1e40af;
  font-family: 'Plus Jakarta Sans', sans-serif;
  font-size: 31px;
  font-weight: 700;
  line-height: 40px;
}
.figma-pricing-section .plan-per-mo {
  color: #090909;
  font-family: 'Plus Jakarta Sans', sans-serif;
  font-size: 20px;
  font-weight: 500;
  line-height: 40px;
}
.figma-pricing-section .plan-per-emp,
.figma-pricing-section .plan-extra {
  margin: 0;
  color: #343a40;
  font-family: 'Plus Jakarta Sans', sans-serif;
  font-size: 16px;
  font-weight: 500;
  line-height: 24px;
}
.figma-pricing-section .plan-per-emp strong { color: #1e40af; font-weight: 500; }
.figma-pricing-section .plan-extra { font-family: Inter, sans-serif; font-weight: 400; }
.figma-pricing-section .plan-annual-save { display: none !important; }
.figma-pricing-section .plan-cta {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 58px;
  margin: 0;
  padding: 14px 30px;
  border: 1.5px solid #1e40af;
  border-radius: 52px;
  background: #fff;
  color: #1e40af;
  font-family: 'Plus Jakarta Sans', sans-serif;
  font-size: 16px;
  font-weight: 500;
  line-height: 24px;
}
.figma-pricing-section .plan-card--momentum .plan-cta {
  background: #1e40af;
  box-shadow: 0 4px 4px rgba(30, 64, 175, .45);
  color: #fff;
}
.figma-pricing-section .plan-cta-note {
  min-height: 24px;
  margin: 10px 0 0;
  color: #343a40;
  font-family: Inter, sans-serif;
  font-size: 16px;
  font-weight: 400;
  line-height: 24px;
}
.figma-pricing-section .plan-features {
  display: flex;
  flex-direction: column;
  gap: 6px;
  margin: 15px 0 0;
}
.figma-pricing-section .plan-feature {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  padding: 0;
  border: 0;
  color: #343a40;
  font-family: Inter, sans-serif;
  font-size: 16px;
  font-weight: 400;
  line-height: 24px;
}
.figma-pricing-section .plan-feature b {
  color: #1e40af;
  font-family: Inter, sans-serif;
  font-size: 16px;
  font-weight: 600;
  line-height: 24px;
}
.figma-pricing-section .feat-ic {
  width: 18px;
  height: 20px;
  margin-top: 2px;
  border-radius: 0;
  background: url('/images/figma-pricing-hero/check.svg') center / 18px 20px no-repeat;
  color: transparent;
  font-size: 0;
}
.figma-pricing-section .compareall { margin-top: 24px; text-align: center; }
.figma-pricing-section .compareall .btn {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  min-height: 58px;
  padding: 14px 30px;
  border-radius: 52px;
  background: #1e40af;
  color: #fff;
  font-family: 'Plus Jakarta Sans', sans-serif;
  font-size: 16px;
  font-weight: 500;
  line-height: 24px;
}
.figma-pricing-section .compareall .btn img { width: 24px; height: 24px; max-width: none; }

@media (max-width: 991px) {
  .figma-pricing-section { padding: 72px 0; }
  .figma-pricing-section .plans-grid { grid-template-columns: 1fr; max-width: 560px; }
  .figma-pricing-section .plan-card { min-height: 0; }
}
@media (max-width: 575px) {
  .figma-pricing-section { padding: 56px 0; }
  .figma-pricing-heading .section-title { font-size: 32px !important; }
  .figma-pricing-heading .section-sub { font-size: 16px; }
  .figma-pricing-section .billing-opt { width: calc((100vw - 48px) / 2); font-size: 14px; }
  .figma-pricing-section .plans-grid { gap: 16px; }
  .figma-pricing-section .plan-card { padding: 24px; }
  .figma-pricing-section .plan-tagline { min-height: 0; }
  .figma-pricing-section .plan-feature { font-size: 15px; }
}

/* ═══════════════════════════════════════════════════════════
   EMPLOYEE COST CALCULATOR — 2026 redesign (Figma node 5385:48120)
   Preserves the existing calculator controls and live-update IDs.
   ═══════════════════════════════════════════════════════════ */
.figma-cost-calculator {
  padding: 100px 0;
  background: #f9fafb;
}
.figma-cost-calculator::before,
.figma-cost-calculator::after { content: none; }
.figma-cost-calculator .cost-calc-inner { max-width: 1320px; }
.figma-cost-calculator .figma-cost-heading {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 15px;
}
.figma-cost-calculator .glossary-badge {
  gap: 7px;
  margin: 0;
  padding: 10px 16px;
  border: 2px solid transparent;
  border-radius: 100px;
  background: linear-gradient(#fff, #fff) padding-box,
    linear-gradient(90deg, #ff6bc9, #7c58ff) border-box;
}
.figma-cost-calculator .glossary-badge img { width: 16px; height: 16px; }
.figma-cost-calculator .glossary-badge span {
  color: #000;
  font-family: 'Plus Jakarta Sans', sans-serif;
  font-size: 18px;
  font-weight: 500;
  line-height: 24px;
}
.figma-cost-calculator .cost-calc-title {
  margin: 0;
  color: #343a40;
  font-family: 'Plus Jakarta Sans', sans-serif;
  font-size: 46px;
  font-weight: 700;
  letter-spacing: -.02em;
  line-height: 1.2;
}
.figma-cost-calculator .cost-calc-title span { color: #1e40af; }
.figma-cost-calculator .cost-calc-sub {
  max-width: none;
  margin: 0;
  color: #656971;
  font-family: 'Plus Jakarta Sans', sans-serif;
  font-size: 18px;
  font-weight: 500;
  line-height: 24px;
}

.figma-cost-calculator .emp-input-row {
  width: 498px;
  margin: 30px auto 0;
  padding: 6px 6px 6px 25px;
  border: 1px solid #e1e6f4;
  border-radius: 54px;
  background: #eef1f6;
}
.figma-cost-calculator .emp-input-row:focus-within { border-color: #1e40af; }
.figma-cost-calculator .emp-input-label {
  padding-right: 15px;
  border-right: 1px solid #d9d9d9;
  color: #343a40;
  font-family: Inter, sans-serif;
  font-size: 16px;
  font-weight: 600;
  line-height: 24px;
  opacity: .6;
}
.figma-cost-calculator .emp-number-input {
  max-width: none;
  padding: 3px 15px;
  border-right: 1px solid #d9d9d9;
  color: #343a40;
  font-family: 'Plus Jakarta Sans', sans-serif;
  font-size: 18px;
  font-weight: 600;
  line-height: 24px;
}
.figma-cost-calculator .emp-calc-btn {
  min-width: 200px;
  min-height: 44px;
  padding: 10px 12px;
  border: 0;
  border-radius: 99px;
  background: #fff;
  box-shadow: 0 2px 4px rgba(0, 0, 0, .1);
  color: #343a40;
  font-family: 'Plus Jakarta Sans', sans-serif;
  font-size: 16px;
  font-weight: 700;
  line-height: 20px;
}
.figma-cost-calculator .emp-calc-btn img { width: 24px; height: 24px; max-width: none; }
.figma-cost-calculator .emp-calc-btn:hover { transform: none; color: #1e40af; }

.figma-cost-calculator .emp-slider-wrap {
  width: 320px;
  margin: 52px auto 18px;
  padding-top: 0;
}
.figma-cost-calculator .slider-tick { display: none; }
.figma-cost-calculator .slider-track-wrap { display: block; }
.figma-cost-calculator .emp-slider-wrap input[type=range] {
  height: 8px;
  margin: 0;
  background: #f2f4f7;
}
.figma-cost-calculator .emp-slider-wrap input[type=range]::-webkit-slider-thumb {
  width: 0;
  height: 0;
  border: 0;
  box-shadow: none;
}
.figma-cost-calculator .emp-slider-wrap input[type=range]::-moz-range-thumb {
  width: 0;
  height: 0;
  border: 0;
  box-shadow: none;
}
.figma-cost-calculator .slider-tooltip {
  bottom: calc(100% + 14px);
  left: 50%;
  padding: 8px 12px 14px;
  border-radius: 8px;
  box-shadow: 0 12px 16px -4px rgba(16, 24, 40, .14), 0 4px 6px -2px rgba(16, 24, 40, .08);
  color: #344054;
  font-family: Inter, sans-serif;
  font-size: 12px;
  font-weight: 600;
  line-height: 18px;
}
.figma-cost-calculator .slider-tooltip::after {
  width: 16px;
  height: 6px;
  border: 0;
  background: url('/images/figma-cost-calculator/tooltip-pointer.svg') center / 16px 6px no-repeat;
}

.figma-cost-calculator .cost-results-grid {
  gap: 30px;
  margin: 0 0 24px;
}
.figma-cost-calculator .cost-result-card {
  display: flex;
  flex-direction: column;
  justify-content: center;
  min-height: 302px;
  padding: 41px;
  border-color: #e1e6f4;
  border-radius: 24px;
  box-shadow: none;
  overflow: visible;
}
.figma-cost-calculator .cost-result-card.recommended {
  border-color: #e1e6f4;
  background: #fff;
}
.figma-cost-calculator .cost-result-card.recommended::before { content: none; }
.figma-cost-calculator .cost-result-card:hover {
  border-color: #60a5fa;
  box-shadow: 0 0 15.3px rgba(24, 72, 212, .1);
}
.figma-cost-calculator #crc-pulse { border-color: #e1e6f4; box-shadow: none; }
.figma-cost-calculator #crc-pulse:hover {
  border-color: #60a5fa;
  box-shadow: 0 0 15.3px rgba(24, 72, 212, .1);
}
.figma-cost-calculator .crc-plan {
  display: inline-flex;
  align-items: center;
  align-self: center;
  gap: 6px;
  margin: 0 0 10px;
  padding: 4px 12px 4px 10px;
  border-radius: 16px;
  background: #fffaeb;
  color: #b54708 !important;
  font-family: Inter, sans-serif;
  font-size: 14px;
  font-weight: 500;
  letter-spacing: 0;
  line-height: 20px;
  text-transform: uppercase;
}
.figma-cost-calculator .crc-plan::before {
  width: 8px;
  height: 8px;
  border-radius: 0;
  background: url('/images/figma-pricing-section/pulse-dot.svg') center / 8px 8px no-repeat;
}
.figma-cost-calculator .crc-price {
  color: #090909;
  font-family: 'Plus Jakarta Sans', sans-serif;
  font-size: 22px;
  font-weight: 600;
  line-height: 30px;
}
.figma-cost-calculator .crc-period {
  color: #090909;
  font-family: 'Plus Jakarta Sans', sans-serif;
  font-size: 14px;
  font-weight: 600;
  line-height: 30px;
}
.figma-cost-calculator .crc-per-emp {
  margin-top: 0;
  color: #343a40;
  font-family: Inter, sans-serif;
  font-size: 16px;
  font-weight: 400;
  line-height: 24px;
}
.figma-cost-calculator .crc-per-emp::before {
  width: 50px;
  height: 4px;
  margin: 10px auto;
  border-radius: 0;
  background: url('/images/figma-pricing-section/section-divider.svg') center / 50px 4px no-repeat;
}
.figma-cost-calculator .crc-badge {
  margin-top: 10px;
  padding: 8px 15px;
  border-radius: 50px;
  background: #eef1f6;
  color: #1e40af;
  font-family: Inter, sans-serif;
  font-size: 16px;
  font-weight: 500;
  letter-spacing: 0;
  line-height: 24px;
}
.figma-cost-calculator .crc-upgrade-note {
  margin-top: 10px;
  color: #343a40;
  font-family: Inter, sans-serif;
  font-size: 16px;
  font-weight: 400;
  line-height: 24px;
}

.figma-cost-calculator .recommended-strip {
  min-height: 112px;
  margin: 0;
  padding: 30px;
  border-radius: 24px;
  background: #070650 url('/images/figma-cost-calculator/recommendation-background.png') center / cover;
  position: relative;
  overflow: hidden;
}
.figma-cost-calculator .recommended-strip::after {
  position: absolute;
  right: -76px;
  bottom: -76px;
  width: 314px;
  height: 314px;
  content: '';
  background: url('/images/figma-cost-calculator/recommendation-flower.svg') center / contain no-repeat;
  transform: rotate(45deg);
  pointer-events: none;
}
.figma-cost-calculator .rec-strip-left,
.figma-cost-calculator .rec-strip-cta { position: relative; z-index: 1; }
.figma-cost-calculator .rec-strip-headline {
  font-family: 'Plus Jakarta Sans', sans-serif;
  font-size: 22px;
  font-weight: 600;
  line-height: 30px;
}
.figma-cost-calculator .rec-strip-detail {
  margin-top: 8px;
  color: #fff;
  font-family: Inter, sans-serif;
  font-size: 16px;
  font-weight: 400;
  line-height: 24px;
}
.figma-cost-calculator .rec-strip-cta {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  min-height: 52px;
  padding: 14px 30px;
  border-radius: 52px;
  background: #1e40af;
  font-family: 'Plus Jakarta Sans', sans-serif;
  font-size: 16px;
  font-weight: 500;
  line-height: 24px;
}
.figma-cost-calculator .rec-strip-cta img { width: 24px; height: 24px; max-width: none; }

@media (max-width: 991px) {
  .figma-cost-calculator { padding: 72px 0; }
  .figma-cost-calculator .cost-results-grid { grid-template-columns: 1fr; max-width: 560px; margin-inline: auto; }
  .figma-cost-calculator .recommended-strip { max-width: 560px; margin-inline: auto; }
}
@media (max-width: 575px) {
  .figma-cost-calculator { padding: 56px 0; }
  .figma-cost-calculator .cost-calc-title { font-size: 32px; }
  .figma-cost-calculator .cost-calc-sub { font-size: 16px; }
  .figma-cost-calculator .emp-input-row { width: 100%; padding-left: 16px; }
  .figma-cost-calculator .emp-input-label { display: none; }
  .figma-cost-calculator .emp-number-input { padding-left: 0; }
  .figma-cost-calculator .emp-calc-btn { min-width: auto; }
  .figma-cost-calculator .emp-slider-wrap { width: min(320px, 100%); }
  .figma-cost-calculator .cost-result-card { min-height: 0; padding: 32px 24px; }
  .figma-cost-calculator .recommended-strip { padding: 24px; }
  .figma-cost-calculator .rec-strip-headline { font-size: 18px; line-height: 26px; }
  .figma-cost-calculator .recommended-strip { align-items: flex-start; }
}

/* ═══════════════════════════════════════════════════════════════════════════
   FULL COMPARISON — 2026 redesign
   ═══════════════════════════════════════════════════════════════════════════ */
.figma-comparison-section {
  padding: 100px 0;
  background: #fff;
}
.figma-comparison-section .figma-comparison-heading {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 14px;
}
.figma-comparison-section .glossary-badge {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  min-height: 38px;
  margin: 0;
  padding: 6px 15px;
  border: 2px solid transparent;
  border-radius: 999px;
  background: linear-gradient(#fff, #fff) padding-box,
    linear-gradient(100deg, #fd55bd, #644eff 78%) border-box;
  color: #343a40;
  font-family: Inter, sans-serif;
  font-size: 14px;
  font-weight: 500;
  line-height: 20px;
}
.figma-comparison-section .glossary-badge img {
  width: 17px;
  height: 17px;
  margin: 0;
}
.figma-comparison-section .section-title {
  max-width: none;
  margin: 0;
  color: #343a40;
  font-family: 'Plus Jakarta Sans', sans-serif;
  font-size: 46px;
  font-weight: 700;
  letter-spacing: -2px;
  line-height: 1.16;
}
.figma-comparison-section .section-title span { color: #1e40af; }
.figma-comparison-section .section-sub {
  max-width: none;
  margin: 0;
  color: #656971;
  font-family: Inter, sans-serif;
  font-size: 18px;
  font-weight: 400;
  line-height: 26px;
}

@media (min-width: 992px) {
  .figma-comparison-section .container { max-width: 1380px; }
  .figma-comparison-section .pricingBox.desktopView {
    width: 100%;
    max-width: 1320px;
    margin: 34px auto 0;
    overflow: auto;
    border: 1px solid #e6e6f9;
    border-radius: 14px;
    background: #fff;
    box-shadow: none;
  }
  .figma-comparison-section .pricingBox.desktopView .pricingHeader {
    position: relative !important;
    top: auto;
    z-index: 1;
    display: grid;
    grid-template-columns: minmax(450px, 1.92fr) repeat(3, minmax(210px, 1fr));
    min-width: 1060px;
    min-height: 124px;
    box-shadow: none;
  }
  .figma-comparison-section .pricingBox.desktopView .pricingHeader > div {
    display: flex;
    min-height: 124px;
    min-width: 0;
    padding: 20px 24px;
    border: 0;
    border-right: 1px solid #e6e6f9;
    border-bottom: 1px solid #e6e6f9;
    border-radius: 0;
  }
  .figma-comparison-section .pricingBox.desktopView .pricingHeader > div:last-child { border-right: 0; }
  .figma-comparison-section .pricingBox.desktopView .modulename {
    flex-direction: column;
    align-items: flex-start;
    justify-content: center;
    gap: 14px;
    background: #f7f7fb;
    border-radius: 13px 0 0 0;
  }
  .figma-comparison-section .pricingBox.desktopView .modulename > div { min-width: 0; }
  .figma-comparison-section .pricingBox.desktopView .modulename span {
    color: #343a40;
    font-family: 'Plus Jakarta Sans', sans-serif;
    font-size: 18px;
    font-weight: 700;
    line-height: 26px;
  }
  .figma-comparison-section .pricingBox.desktopView .modulename p {
    position: static;
    margin: 4px 0 0;
    color: #656971;
    font-family: Inter, sans-serif;
    font-size: 14px;
    font-weight: 400;
    line-height: 20px;
  }
  .figma-comparison-section .pricingBox.desktopView .light-blue-btn {
    display: inline-flex;
    flex: 0 0 auto;
    align-items: center;
    justify-content: center;
    gap: 5px;
    min-height: 37px;
    margin: 0 !important;
    padding: 10px 22px;
    border: 0 !important;
    border-radius: 999px;
    background: #1e40af !important;
    color: #fff !important;
    font-family: Inter, sans-serif;
    font-size: 12px;
    font-weight: 500;
    line-height: 17px;
    white-space: nowrap;
    transition: background-color .2s ease, transform .2s ease;
  }
  .figma-comparison-section .pricingBox.desktopView .light-blue-btn:hover,
  .figma-comparison-section .pricingBox.desktopView .light-blue-btn:focus-visible {
    background: #18358f !important;
    color: #fff !important;
    transform: translateY(-1px);
  }
  .figma-comparison-section .pricingBox.desktopView .light-blue-btn img {
    width: 16px;
    height: 16px;
  }
  .figma-comparison-section .pricingBox.desktopView .moduleHead {
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 13px;
    background: #fff !important;
  }
  .figma-comparison-section .pricingBox.desktopView .moduleHead .head {
    color: #1e40af;
    font-family: 'Plus Jakarta Sans', sans-serif;
    font-size: 22px;
    font-weight: 700;
    line-height: 28px;
  }
  .figma-comparison-section .pricingBox.desktopView .moduleHead .light-blue-btn {
    min-width: 126px;
    background: #030303 !important;
  }
  .figma-comparison-section .pricingBox.desktopView .moduleHead .light-blue-btn:hover,
  .figma-comparison-section .pricingBox.desktopView .moduleHead .light-blue-btn:focus-visible { background: #272727 !important; }
  .figma-comparison-section .pricingBox.desktopView .moduleHead:nth-child(4) { border-radius: 0 13px 0 0; }

  .figma-comparison-section .pricingBox.desktopView .pricingBodyDataInner {
    position: relative;
    z-index: 0;
    display: grid;
    grid-template-columns: minmax(450px, 1.92fr) repeat(3, minmax(210px, 1fr));
    min-width: 1060px;
  }
  .figma-comparison-section .pricingBox.desktopView .pricingBodyDataInner > div {
    display: flex;
    min-height: 56px;
    height: auto;
    min-width: 0;
    padding: 12px 24px;
    border: 0;
    border-right: 1px solid #e6e6f9;
    border-bottom: 1px solid #e6e6f9;
    border-radius: 0;
  }
  .figma-comparison-section .pricingBox.desktopView .pricingBodyDataInner > div:last-child { display: none; }
  .figma-comparison-section .pricingBox.desktopView .pricingBodyDataInner > div:nth-child(4) { border-right: 0; }
  .figma-comparison-section .pricingBox.desktopView .parentHead > div {
    min-height: 61px;
    background: #f7f7fb;
  }
  .figma-comparison-section .pricingBox.desktopView .parentHead .priceHead {
    justify-content: flex-start;
    gap: 14px;
    cursor: pointer;
  }
  .figma-comparison-section .pricingBox.desktopView .parentHead .priceHead p {
    padding: 0 !important;
    color: #343a40;
    font-family: 'Plus Jakarta Sans', sans-serif;
    font-size: 16px;
    font-weight: 600;
    line-height: 24px !important;
  }
  .figma-comparison-section .pricingBox.desktopView .parentHead .priceHead i {
    order: -1;
    width: 24px;
    height: 24px;
    margin: 0;
    background: url('/images/figma-comparison/chevron-down.svg') center / 20px no-repeat;
    color: transparent;
    font-size: 0;
    transition: transform .2s ease;
  }
  .figma-comparison-section .pricingBox.desktopView .parent:not(.active) .parentHead .priceHead i { transform: rotate(-90deg); }
  .figma-comparison-section .pricingBox.desktopView #corehr .parentHead .priceHead p { color: #1e40af; }
  .figma-comparison-section .pricingBox.desktopView .parentInner .priceHead {
    align-items: center;
    justify-content: flex-start;
    gap: 13px;
    background: #fcfcff;
  }
  .figma-comparison-section .pricingBox.desktopView .parentInner .priceHead::before {
    width: 24px;
    height: 24px;
    flex: 0 0 24px;
    content: '';
    background: url('/images/figma-comparison/feature-icon.svg') center / contain no-repeat;
  }
  .figma-comparison-section .pricingBox.desktopView .parentInner .priceHead p {
    padding: 0 !important;
    color: #343a40;
    font-family: Inter, sans-serif;
    font-size: 14px;
    font-weight: 400;
    line-height: 20px !important;
  }
  .figma-comparison-section .pricingBox.desktopView .parentInner .priceHead p::after {
    display: none !important;
    content: none !important;
  }
  .figma-comparison-section .pricingBox.desktopView .parentInner .pricelist {
    background: #fff;
    color: #343a40;
    font-family: Inter, sans-serif;
    font-size: 14px;
    line-height: 20px;
  }
  .figma-comparison-section .pricingBox.desktopView .pricelist .feather-check {
    display: block;
    width: 24px;
    height: 24px;
    background: url('/images/figma-comparison/check.svg') center / contain no-repeat;
    color: transparent;
    font-size: 0;
  }
  .figma-comparison-section .pricingBox.desktopView .pricelist .feather-x {
    color: #f04438;
    font-size: 21px;
  }
  .figma-comparison-section .pricingBox.desktopView .parent:last-child .pricingBodyDataInner:last-child > div:first-child { border-radius: 0 0 0 13px; }
}

@media (max-width: 991px) {
  .figma-comparison-section { padding: 72px 0; }
  .figma-comparison-section .pricingBox.mobileView { margin-top: 30px; }
}
@media (max-width: 575px) {
  .figma-comparison-section { padding: 56px 0; }
  .figma-comparison-section .section-title { font-size: 32px; letter-spacing: -1.2px; }
  .figma-comparison-section .section-sub { font-size: 16px; line-height: 24px; }
}

/* ═══════════════════════════════════════════════════════════════════════════
   ROI CALCULATOR — 2026 redesign
   ═══════════════════════════════════════════════════════════════════════════ */
.figma-roi-section {
  padding: 100px 0;
  background: #f7f9fd;
}
.figma-roi-section .container { max-width: 1320px; }
.figma-roi-section .calc-grid {
  grid-template-columns: minmax(0, 574px) minmax(0, 1fr);
  align-items: stretch;
  gap: 30px;
}
.figma-roi-section .calc-copy {
  display: flex;
  flex-direction: column;
  justify-content: center;
  min-height: 578px;
}
.figma-roi-section .glossary-badge {
  display: inline-flex;
  align-self: flex-start;
  align-items: center;
  gap: 7px;
  min-height: 44px;
  margin: 0 0 15px;
  padding: 10px 16px;
  border: 2px solid transparent;
  border-radius: 999px;
  background: linear-gradient(#fff, #fff) padding-box,
    linear-gradient(90deg, #ff6bc9, #7c58ff) border-box;
  color: #343a40;
  font-family: 'Plus Jakarta Sans', sans-serif;
  font-size: 18px;
  font-weight: 500;
  line-height: 24px;
}
.figma-roi-section .glossary-badge img {
  width: 16px;
  height: 16px;
  margin: 0;
}
.figma-roi-section .calc-copy .section-title {
  max-width: 574px;
  margin: 0;
  color: #343a40;
  font-family: 'Plus Jakarta Sans', sans-serif;
  font-size: 46px !important;
  font-weight: 700;
  letter-spacing: -2px;
  line-height: 1.16;
}
.figma-roi-section .calc-copy .section-title span { color: #1e40af; }
.figma-roi-section .calc-copy .section-sub {
  max-width: 574px;
  margin: 15px 0 0;
  color: #656971;
  font-family: Inter, sans-serif;
  font-size: 16px;
  font-weight: 400;
  line-height: 24px;
}
.figma-roi-section .stat-row {
  width: 100%;
  max-width: 517px;
  gap: 0;
  margin-top: 24px;
  border-right: 1px solid #e1e6f4;
  border-bottom: 1px solid #e1e6f4;
}
.figma-roi-section .stat-box {
  position: relative;
  display: flex;
  flex-direction: column;
  min-height: 108px;
  padding: 16px 21px;
  border: 1px solid #e1e6f4;
  border-right: 0;
  border-bottom: 0;
  border-radius: 0;
  background: #fff;
  box-shadow: none;
}
.figma-roi-section .stat-box::after {
  display: block;
  width: 50px;
  height: 4px;
  margin-top: 10px;
  content: '';
  background: url('/images/figma-roi-calculator/underline-orange.svg') left center / 50px 4px no-repeat;
  order: 2;
}
.figma-roi-section .stat-box:nth-child(2)::after { background-image: url('/images/figma-roi-calculator/underline-orange-alt.svg'); }
.figma-roi-section .stat-box:nth-child(3)::after { background-image: url('/images/figma-roi-calculator/underline-orange-soft.svg'); }
.figma-roi-section .stat-box:nth-child(4)::after { background-image: url('/images/figma-roi-calculator/underline-blue.svg'); }
.figma-roi-section .stat-num {
  order: 1;
  color: #090909;
  font-family: 'Plus Jakarta Sans', sans-serif;
  font-size: 22px;
  font-weight: 600;
  line-height: 30px;
}
.figma-roi-section .stat-box.orange .stat-num { color: #090909; }
.figma-roi-section .stat-desc {
  order: 3;
  margin: 10px 0 0;
  color: #343a40;
  font-family: Inter, sans-serif;
  font-size: 16px;
  font-weight: 400;
  line-height: 24px;
}

.figma-roi-section .figma-roi-widget {
  display: flex;
  min-height: 578px;
  padding: 15px;
  border: 1px solid #d9e7fe;
  border-radius: 30px;
  background: rgba(233, 231, 255, .6);
  box-shadow: none;
}
.figma-roi-section .figma-roi-widget-inner {
  position: relative;
  display: flex;
  width: 100%;
  flex-direction: column;
  gap: 24px;
  overflow: hidden;
  padding: 40px;
  border-radius: 22px;
  background: #070650 url('/images/figma-roi-calculator/calculator-background.png') center / cover;
}
.figma-roi-section .figma-roi-widget-inner::after {
  position: absolute;
  bottom: -76px;
  left: -112px;
  width: 311px;
  height: 312px;
  content: '';
  background: url('/images/figma-roi-calculator/calculator-flower.svg') center / contain no-repeat;
  transform: rotate(127deg);
  pointer-events: none;
}
.figma-roi-section .figma-roi-widget-inner > * { position: relative; z-index: 1; }
.figma-roi-section .calc-widget h3 {
  margin: 0;
  color: #fff;
  font-family: 'Plus Jakarta Sans', sans-serif;
  font-size: 31px;
  font-weight: 700;
  line-height: 40px;
}
.figma-roi-section .calc-row {
  margin: 0;
}
.figma-roi-section .calc-lbl {
  display: block;
  margin: 0 0 8px;
  color: #fff;
  font-family: Inter, sans-serif;
  font-size: 16px;
  font-weight: 400;
  line-height: 24px;
}
.figma-roi-section .roi-slider-control {
  position: relative;
  padding-top: 6px;
}
.figma-roi-section .roi-slider-control input[type=range] {
  display: block;
  width: 100%;
  height: 8px;
  margin: 0;
  -webkit-appearance: none;
  appearance: none;
  border-radius: 8px;
  outline: 0;
  background: linear-gradient(to right, #60a5fa var(--roi-slider-progress, 50%), #f2f4f7 var(--roi-slider-progress, 50%));
  cursor: pointer;
}
.figma-roi-section .roi-slider-control input[type=range]::-webkit-slider-thumb {
  width: 0;
  height: 0;
  border: 0;
  box-shadow: none;
}
.figma-roi-section .roi-slider-control input[type=range]::-moz-range-thumb {
  width: 0;
  height: 0;
  border: 0;
}
.figma-roi-section .roi-slider-value {
  position: absolute;
  bottom: 14px;
  left: var(--roi-slider-progress, 50%);
  display: block;
  min-width: 44px;
  padding: 8px 12px 14px;
  border-radius: 8px;
  background: #fff;
  box-shadow: 0 12px 16px -4px rgba(16, 24, 40, .08), 0 4px 6px -2px rgba(16, 24, 40, .03);
  color: #344054;
  font-family: Inter, sans-serif;
  font-size: 12px;
  font-weight: 600;
  line-height: 18px;
  text-align: center;
  white-space: nowrap;
  transform: translateX(-50%);
  pointer-events: none;
}
.figma-roi-section .roi-slider-value::after {
  position: absolute;
  bottom: -6px;
  left: 50%;
  width: 16px;
  height: 6px;
  content: '';
  background: url('/images/figma-roi-calculator/tooltip-pointer.svg') center / contain no-repeat;
  transform: translateX(-50%);
}
.figma-roi-section .results-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 0;
  margin: 0;
  padding: 0;
  border: 0;
  border-radius: 14px;
  background: #fff;
  overflow: hidden;
}
.figma-roi-section .res-box {
  min-height: 130px;
  padding: 15px;
  border-right: 1px solid #dbdbf0;
  border-radius: 0;
  background: #fff;
}
.figma-roi-section .res-box:last-child { border-right: 0; }
.figma-roi-section .res-val {
  color: #60a5fa;
  font-family: 'Plus Jakarta Sans', sans-serif;
  font-size: 18px;
  font-weight: 700;
  line-height: 24px;
}
.figma-roi-section .res-val.hi { color: #1e40af; }
.figma-roi-section .roi-result-line {
  display: block;
  width: 50px;
  height: 4px;
  margin: 10px 0;
  background: url('/images/figma-roi-calculator/underline-blue.svg') left center / 50px 4px no-repeat;
}
.figma-roi-section .res-label {
  color: #343a40;
  font-family: Inter, sans-serif;
  font-size: 16px;
  font-weight: 400;
  line-height: 24px;
  letter-spacing: 0;
  text-transform: none;
}
.figma-roi-section .calc-cta {
  align-self: flex-start;
  width: auto;
  margin: 0;
  padding: 14px 30px;
  border: 1.5px solid #1e40af;
  border-radius: 52px;
  background: #fff;
  color: #1e40af;
  font-family: Inter, sans-serif;
  font-size: 16px;
  font-weight: 500;
  line-height: 24px;
}
.figma-roi-section .calc-cta:hover,
.figma-roi-section .calc-cta:focus-visible {
  border-color: #1e40af;
  background: #1e40af;
  color: #fff;
}

@media (max-width: 991px) {
  .figma-roi-section { padding: 72px 0; }
  .figma-roi-section .calc-grid { grid-template-columns: 1fr; }
  .figma-roi-section .calc-copy { min-height: 0; }
  .figma-roi-section .figma-roi-widget { max-width: 700px; }
}
@media (max-width: 575px) {
  .figma-roi-section { padding: 56px 0; }
  .figma-roi-section .calc-copy .section-title { font-size: 32px !important; letter-spacing: -1.2px; }
  .figma-roi-section .glossary-badge { min-height: 38px; padding: 6px 14px; font-size: 14px; line-height: 20px; }
  .figma-roi-section .figma-roi-widget { padding: 8px; border-radius: 22px; }
  .figma-roi-section .figma-roi-widget-inner { min-height: 0; padding: 28px 20px; border-radius: 15px; }
  .figma-roi-section .calc-widget h3 { font-size: 26px; line-height: 34px; }
  .figma-roi-section .results-grid { grid-template-columns: 1fr 1fr; }
  .figma-roi-section .res-box { min-height: 112px; border-bottom: 1px solid #dbdbf0; }
  .figma-roi-section .res-box:nth-child(2) { border-right: 0; }
  .figma-roi-section .res-box:nth-child(n+3) { border-bottom: 0; }
  .figma-roi-section .res-label { font-size: 13px; line-height: 19px; }
  .figma-roi-section .calc-cta { width: 100%; padding-inline: 16px; }
}

/* ═══════════════════════════════════════════════════════════════════════════
   ADD-ON MODULES — 2026 redesign
   ═══════════════════════════════════════════════════════════════════════════ */
.figma-addons-section {
  padding: 100px 0;
  background: #fff;
}
.figma-addons-section .container {
  width: min(1320px, calc(100% - 40px));
  max-width: none;
}
.figma-addons-section .figma-addons-heading {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 15px;
}
.figma-addons-section .glossary-badge {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  min-height: 44px;
  margin: 0;
  padding: 10px 16px;
  border: 2px solid transparent;
  border-radius: 999px;
  background: linear-gradient(#fff, #fff) padding-box,
    linear-gradient(90deg, #ff6bc9, #7c58ff) border-box;
  color: #343a40;
  font-family: 'Plus Jakarta Sans', sans-serif;
  font-size: 18px;
  font-weight: 500;
  line-height: 24px;
}
.figma-addons-section .glossary-badge img {
  width: 16px;
  height: 16px;
  margin: 0;
}
.figma-addons-section .section-title {
  max-width: none;
  margin: 0;
  color: #343a40;
  font-family: 'Plus Jakarta Sans', sans-serif;
  font-size: 46px;
  font-weight: 700;
  letter-spacing: -2px;
  line-height: 1.16;
}
.figma-addons-section .section-title span { color: #1e40af; }
.figma-addons-section .section-sub {
  max-width: none;
  margin: 0;
  color: #656971;
  font-family: 'Plus Jakarta Sans', sans-serif;
  font-size: 18px;
  font-weight: 500;
  line-height: 24px;
}
.figma-addons-section .addons-grid {
  display: flex !important;
  width: 100%;
  margin-top: 30px;
  gap: 30px;
  flex-wrap: wrap;
  align-items: flex-start;
  justify-content: center;
}
.figma-addons-section .addon-card {
  display: flex;
  width: 420px;
  min-height: 300px;
  padding: 31px;
  border: 1px solid #e1e6f4;
  border-radius: 24px;
  background: #fff;
  box-shadow: none;
  transition: border-color .2s ease, box-shadow .2s ease, transform .2s ease;
}
.figma-addons-section .addon-card:hover {
  border-color: #60a5fa;
  background: #fff;
  box-shadow: 0 0 30.6px rgba(24, 72, 212, .1);
  transform: translateY(-2px);
}
.figma-addons-section .addon-card-link {
  display: flex;
  width: 100%;
  min-height: 236px;
  flex-direction: column;
  color: inherit;
}
.figma-addons-section .addon-card-link:hover,
.figma-addons-section .addon-card-link:focus-visible { color: inherit; }
.figma-addons-section .addon-icon-wrap {
  display: flex;
  width: 60px;
  height: 60px;
  margin: 0 0 15px;
  align-items: center;
  justify-content: center;
  border-radius: 50px;
  background: rgba(78, 139, 253, .1);
}
.figma-addons-section .addon-icon-wrap img {
  width: 25px;
  height: 25px;
  max-width: none;
}
.figma-addons-section .addon-name {
  margin: 0;
  color: #343a40;
  font-family: 'Plus Jakarta Sans', sans-serif;
  font-size: 22px;
  font-weight: 700;
  line-height: 30px;
}
.figma-addons-section .addon-name::after {
  display: block;
  width: 50px;
  height: 4px;
  margin-top: 10px;
  content: '';
  background: url('/images/figma-addons/underline-secondary.svg') left center / 50px 4px no-repeat;
}
.figma-addons-section .addon-card:first-child .addon-name::after {
  background-image: url('/images/figma-addons/underline-primary.svg');
}
.figma-addons-section .addon-desc {
  margin-top: 10px;
  color: #364969;
  font-family: Inter, sans-serif;
  font-size: 16px;
  font-weight: 400;
  line-height: 24px;
}
.figma-addons-section .addon-read-more {
  display: flex;
  width: 100%;
  margin-top: auto;
  align-items: center;
  justify-content: space-between;
  color: #1e40af;
  font-family: 'Plus Jakarta Sans', sans-serif;
  font-size: 18px;
  font-weight: 500;
  line-height: 24px;
}
.figma-addons-section .addon-card:first-child .addon-read-more { text-decoration: underline; }
.figma-addons-section .addon-read-more img {
  width: 24px;
  height: 24px;
  max-width: none;
}

@media (min-width: 1360px) {
  .figma-addons-section .container {
    width: 1320px !important;
    max-width: 1320px !important;
  }
  .figma-addons-section .addons-grid {
    display: grid !important;
    grid-template-columns: repeat(6, 195px);
    justify-content: center;
  }
  .figma-addons-section .addon-card {
    width: 420px;
    grid-column: span 2;
  }
  .figma-addons-section .addon-card:nth-child(4) { grid-column: 2 / span 2; }
  .figma-addons-section .addon-card:nth-child(5) { grid-column: 4 / span 2; }
}

@media (max-width: 991px) {
  .figma-addons-section { padding: 72px 0; }
  .figma-addons-section .addon-card { width: min(420px, calc(50% - 15px)); }
}
@media (max-width: 575px) {
  .figma-addons-section { padding: 56px 0; }
  .figma-addons-section .section-title { font-size: 32px; letter-spacing: -1.2px; }
  .figma-addons-section .section-sub { font-size: 16px; }
  .figma-addons-section .glossary-badge { min-height: 38px; padding: 6px 14px; font-size: 14px; line-height: 20px; }
  .figma-addons-section .addons-grid { gap: 16px; }
  .figma-addons-section .addon-card { width: 100%; min-height: 0; padding: 24px; }
  .figma-addons-section .addon-card-link { min-height: 0; gap: 0; }
  .figma-addons-section .addon-read-more { margin-top: 24px; }
}

/* ═══════════════════════════════════════════════════════════════════════════
   COMMON QUESTIONS — 2026 redesign
   ═══════════════════════════════════════════════════════════════════════════ */
.figma-faq-section.setu-spreadsheet-section {
  padding: 100px 0 !important;
  background: #f9fafb !important;
  scroll-margin-top: 100px;
}
.figma-faq-section .container {
  width: min(1320px, calc(100% - 40px));
  max-width: none;
}
.figma-faq-section .setu-spreadsheet-heading-box.figma-faq-heading {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 15px;
  max-width: none;
  margin: 0;
  text-align: left;
}
.figma-faq-section .glossary-badge {
  display: inline-flex !important;
  align-items: center;
  gap: 7px;
  min-height: 44px;
  margin: 0;
  padding: 10px 16px;
  border: 2px solid transparent;
  border-radius: 999px;
  background: linear-gradient(#fff, #fff) padding-box,
    linear-gradient(90deg, #ff6bc9, #7c58ff) border-box;
  color: #343a40;
  font-family: 'Plus Jakarta Sans', sans-serif;
  font-size: 18px;
  font-weight: 500;
  line-height: 24px;
}
.figma-faq-section .glossary-badge img {
  width: 16px;
  height: 16px;
  margin: 0;
}
.figma-faq-section .cheque-headline {
  margin: 0;
  color: #343a40;
  font-family: 'Plus Jakarta Sans', sans-serif;
  font-size: 46px;
  font-weight: 700;
  letter-spacing: -2px;
  line-height: 1.16;
}
.figma-faq-section .cheque-headline .accent { color: #1e40af; }
.figma-faq-section .new-faqs-accordion {
  margin-top: 32px;
  border: 0;
  border-top: 1px solid rgba(0, 0, 0, .1);
  border-radius: 0;
  background: transparent;
}
.figma-faq-section .new-faqs-accordion .accordion-item {
  overflow: visible;
  border: 0;
  border-bottom: 1px solid rgba(0, 0, 0, .1);
  border-radius: 0;
  background: transparent;
}
.figma-faq-section .new-faqs-accordion .accordion-header { margin: 0; }
.figma-faq-section .new-faqs-accordion .accordion-button {
  display: flex !important;
  width: 100%;
  align-items: flex-start;
  justify-content: space-between;
  min-height: 74px;
  padding: 24px 0;
  border: 0;
  border-radius: 0 !important;
  background: transparent;
  box-shadow: none;
  color: rgba(0, 0, 0, .9);
  font-family: 'Plus Jakarta Sans', sans-serif;
  font-size: 18px !important;
  font-weight: 700;
  line-height: 26px;
}
.figma-faq-section .new-faqs-accordion .accordion-button:not(.collapsed) {
  background: transparent;
  box-shadow: none;
  color: rgba(0, 0, 0, .9);
}
.figma-faq-section .new-faqs-accordion .accordion-button:focus {
  outline: 0 !important;
  box-shadow: none !important;
}
.figma-faq-section .new-faqs-accordion .accordion-button:focus-visible {
  outline: 0 !important;
  box-shadow: none !important;
}
.figma-faq-section .new-faqs-accordion .accordion-button::after,
.figma-faq-section .new-faqs-accordion .accordion-button:not(.collapsed)::after {
  flex: 0 0 16px !important;
  width: 16px !important;
  height: 16px !important;
  margin-left: 24px !important;
  background: url('/images/figma-faq/plus.svg') center / 16px 16px no-repeat !important;
  content: '' !important;
  font-family: initial !important;
  font-size: 0 !important;
  line-height: 0 !important;
  transform: none !important;
}
.figma-faq-section .new-faqs-accordion .accordion-body {
  max-width: 1284px;
  padding: 0 0 25px;
  color: rgba(0, 0, 0, .9);
  font-family: Inter, sans-serif;
  font-size: 16px !important;
  font-weight: 400;
  line-height: 24px;
}
.figma-faq-section .new-faqs-accordion .accordion-body ol,
.figma-faq-section .new-faqs-accordion .accordion-body ul { margin: 12px 0 0; }

@media (min-width: 1360px) {
  .figma-faq-section .container {
    width: 1320px !important;
    max-width: 1320px !important;
  }
}
@media (max-width: 575px) {
  .figma-faq-section.setu-spreadsheet-section { padding: 56px 0 !important; }
  .figma-faq-section .container { width: min(100% - 32px, 1320px); }
  .figma-faq-section .glossary-badge { min-height: 38px; padding: 6px 14px; font-size: 14px; line-height: 20px; }
  .figma-faq-section .cheque-headline { font-size: 32px; letter-spacing: -1.2px; }
  .figma-faq-section .new-faqs-accordion { margin-top: 24px; }
  .figma-faq-section .new-faqs-accordion .accordion-button { min-height: 0; padding: 20px 0; font-size: 16px !important; line-height: 24px; }
  .figma-faq-section .new-faqs-accordion .accordion-body { font-size: 15px; line-height: 23px; }
}